Question

我是AngularJS的法国首发，我对此代码有疑问：

<div class="imc-responce sous-poids" ng-show="(user.poids) / [(user.taille/100) * (user.taille/100)] < 20" ng-hide="(user.poids) / [(user.taille/100) * (user.taille/100)] > 20">
    <p>Votre I.M.C est de <span ng-model="user.imc">{{ (user.poids) / [(user.taille/100) * (user.taille/100)] | number:2 }}</span></p>
    <p><span>Votre poids se trouve dans la catégorie «Sous-poids» Attention, cette valeur n’est pas avantageuse pour votre santé. Nous vous conseillons d’augmenter votre poids jusqu’au atteindre un IMC normal.</span></p>
</div>
<!-- Normalité -->
<div class="imc-responce sous-poids" ng-show="(user.poids) / [(user.taille/100) * (user.taille/100)] < 22" ng-hide="(user.poids) / [(user.taille/100) * (user.taille/100)] < 20">
    <p>Votre I.M.C est de <span ng-model="user.imc">{{ (user.poids) / [(user.taille/100) * (user.taille/100)] | number:2 }}</span></p>
    <p><span>Votre poids se trouve dans la catégorie de la «Normalité» proche de la limite inférieure. Faites attention parce que une légère perte du poids peut vous amener vers la catégorie «Sous-poids».</span></p>
</div>
<div class="imc-responce sous-poids" ng-show="(user.poids) / [(user.taille/100) * (user.taille/100)] < 23" ng-hide="(user.poids) / [(user.taille/100) * (user.taille/100)] < 22">
    <p>Votre I.M.C est de <span ng-model="user.imc">{{ (user.poids) / [(user.taille/100) * (user.taille/100)] | number:2 }}</span></p>
    <p><span>Félicitations, votre poids se trouve dans la catégorie de la «Normalité». Pour se maintenir  dans cet état il est très important de continuer à manger de façon équilibrée et de faire de l’activité physique.</span></p>
</div>
<div class="imc-responce sous-poids" ng-show="(user.poids) / [(user.taille/100) * (user.taille/100)] < 25" ng-hide="(user.poids) / [(user.taille/100) * (user.taille/100)] < 23">
    <p>Votre I.M.C est de <span ng-model="user.imc">{{ (user.poids) / [(user.taille/100) * (user.taille/100)] | number:2 }}</span></p>
    <p><span>Votre poids se trouve dans la catégorie de la «normalité» proche de la limite supérieure. Faites attention parce qu’un léger incrément de poids peut vous amener vers la catégorie de «Surpoids».</span></p>
</div>
<!-- Surcharge pondérale -->
<div class="imc-responce sous-poids" ng-show="(user.poids) / [(user.taille/100) * (user.taille/100)] < 30" ng-hide="(user.poids) / [(user.taille/100) * (user.taille/100)] < 25">
    <p>Votre I.M.C est de <span ng-model="user.imc">{{ (user.poids) / [(user.taille/100) * (user.taille/100)] | number:2 }}</span></p>
    <p><span>Vous êtes dans la catégorie de «surcharge pondérale», le surpoids peut augmenter la probabilité de contracter des maladies cardiovasculaires comme le diabète, l’hypertension etc. qui représentent des risques pour votre santé. Nous vous conseillons de revoir votre alimentation ainsi que votre niveau d’activité physique.</span></p>
</div>
<!-- Surcharge pondérale -->
<div class="imc-responce sous-poids" ng-show="(user.poids) / [(user.taille/100) * (user.taille/100)] < 45" ng-hide="(user.poids) / [(user.taille/100) * (user.taille/100)] < 30">
    <p>Votre I.M.C est de <span ng-model="user.imc">{{ (user.poids) / [(user.taille/100) * (user.taille/100)] | number:2 }}</span></p>
    <p><span>Vous êtes dans la catégorie de «surcharge pondérale», l’obésité peut augmenter la probabilité de contracter des maladies cardiovasculaires comme le diabète, l’hypertension etc. qui représentent des risques pour votre santé. Nous vous conseillons de revoir votre alimentation ainsi que votre niveau d’activité physique.</span></p>
</div>

它是一个简单的IMC（即体重指数）计算器。

Angular在用户输入给定字段中的某些值并显示结果后显示一条消息。但它同时显示所有消息;我希望它一次显示一个。

Answer 1

ng-show和ng-hide与你不需要同时使用它们相同如果它的真实ng-show显示div，如果它真正的ng-hide div，那么在你的情况下ng-hide会影响代码并从跨度中删除ng模型

你可以尝试类似的东西

<div class="imc-responce sous-poids" ng-show="checkBetween(firstnum,secondnum)"> //send number here firstnum will be 10 for example
        <p>Votre I.M.C est de <span>{{user.xnum}}</span></p>
        <p><span>Votre poids se trouve dans la catégorie «Sous-poids» Attention, cette valeur n’est pas avantageuse pour votre santé. Nous vous conseillons d’augmenter votre poids jusqu’au atteindre un IMC normal.</span></p>
    </div>

并在您的控制器中

$scope.checkBetween = function (firstnum, secondnum) {
        var user = $scope.user;
        var n = user.taille / 100 *2;
        $scope.user.xnum = (user.poids) / n;

        if ($scope.user.xnum > firstnum && $scope.user.xnum < secondnum)
            return true

        return false
    }

Answer 2

我测试你的解决方案，但imc没有出现。我对abgular有一点经验..：/抱歉

<div ng-controller="checkBetween">  
        <div class="imc-responce sous-poids" ng-show="checkBetween(firstnum,secondnum)"> //send number here firstnum will be 10 for example
            <p>Votre I.M.C est de <span>{{user.xnum}}</span></p>
            <p><span>Votre poids se trouve dans la catégorie «Sous-poids» Attention, cette valeur n’est pas avantageuse pour votre santé. Nous vous conseillons d’augmenter votre poids jusqu’au atteindre un IMC normal.</span></p>
        </div>
    </div>


    <script>

        $scope.checkBetween = function (firstnum, secondnum) {
        var user = $scope.user;
        var n = user.taille / 100 *2;
        $scope.user.xnum = (user.poids) / n;

        if ($scope.user.xnum > firstnum && $scope.user.xnum < secondnum)
            return true

        return false
    }

    </script>

Answer 3

感谢您的耐心等待，但这确实是这个概念。

我们有两个输入： - 输入：重量 - 输入：大小

我们计算imc： - 重量/尺寸²= Imc

我们必须显示包含结果的消息： 示例：

Imc＆lt; = 20 else show«Votre poids se trouve danslacatégorie«Sous-poids»注意，cette valeur n'est pas avantageuse pourvotreeanté。 Nous vous conseillons d'augmenter votre poids jusqu'au atteind un IMC normal。 »
Imc在20到50之间显示«Vousêtesdanslacatégoriede«附加水池»，l'obésitépeutaugmenterlaprobabilitédecontracter des maladies cardiovasculaires commelediabète，l'hypertension etc.quireprésententdesrisques投票选择santé。 Nous vous conseillons de revoir votre alimentation ainsi que votre niveau d'activitéphloique。 »

...

Answer 4

您遇到的主要问题是一个简单的印刷错误：您使用的方括号应该是括号：

ng-show="(user.poids) / [(user.taille/100) * (user.taille/100)] < 22">

如果那是(user.poids) / ((user.taille/100) * (user.taille/100)) < 22，那么你的表演/隐藏就可以了。

尽管如此，还有很多其他改进空间：

在同一元素上同时使用ng-show和ng-hide是没有必要的（或者是个好主意）。
您可能需要考虑计算控制器或指令中的BMI，这将使模板更容易阅读和推理。（或者，实际上，在数据模型上设置描述字符串，而不是将其放在单独的show / hide div中。）
我不确定你的意图是将ng-model放在每个区块内的<span>内，但它可能没有按照您的预期做任何事情。

这是一个快速而肮脏的演示：

＆＃13;

window.app = angular.module('myApp', []);
app.controller('myCtrl', function ($scope) {
  // Note that a shared controller is NOT the best place to stash 
  // the user variable; this is just for demonstration purposes
  $scope.updateIMC = function() {
    $scope.user.imc = ($scope.user.poids / (($scope.user.taille / 100) * ($scope.user.taille / 100))) || 0;
  };
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
  Poids: <input type="text" ng-model="user.poids" ng-change="updateIMC()"><br>
  Taille: <input type="text" ng-model="user.taille" ng-change="updateIMC()"><br>
<p>Votre I.M.C est de {{user.imc}}</p>

<p ng-show="user.imc < 20">Votre poids se trouve dans la catégorie «Sous-poids» Attention, cette valeur n’est pas avantageuse pour votre santé. Nous vous conseillons d’augmenter votre poids jusqu’au atteindre un IMC normal.</p>
<p ng-show="user.imc >= 20 && user.imc < 23">Félicitations, votre poids se trouve dans la catégorie de la «Normalité». Pour se maintenir  dans cet état il est très important de continuer à manger de façon équilibrée et de faire de l’activité physique.</p>
<p ng-show="user.imc >= 23 && user.imc < 25">Votre poids se trouve dans la catégorie de la «normalité» proche de la limite supérieure. Faites attention parce qu’un léger incrément de poids peut vous amener vers la catégorie de «Surpoids».</p>
<p ng-show="user.imc >= 25 && user.imc < 30">Vous êtes dans la catégorie de «surcharge pondérale», le surpoids peut augmenter la probabilité de contracter des maladies cardiovasculaires comme le diabète, l’hypertension etc. qui représentent des risques pour votre santé. Nous vous conseillons de revoir votre alimentation ainsi que votre niveau d’activité physique.</p>
<p ng-show="user.imc >= 30">Vous êtes dans la catégorie de «surcharge pondérale», l’obésité peut augmenter la probabilité de contracter des maladies cardiovasculaires comme le diabète, l’hypertension etc. qui représentent des risques pour votre santé. Nous vous conseillons de revoir votre alimentation ainsi que votre niveau d’activité physique.</p>

＆＃13;

AngularJs / Ng-Show显示结果

4 个答案: