Question

我想在选择特定选项时显示div标签。我正在用Angular和Ionic开发它。我现在已经搜索了一段时间，但我找不到任何对我有用的答案，因此我写这篇文章。我想显示第二个选项（身份证号码2），但我无法让它工作。

这是HTML：

<div class="row row-white">
    <div class="col col-white">
<label>
    <select name="keys" ng-options="key.name for key in list" ng-change="myCtrl()" ng-model="testValue"  class="select-input" style="margin-left:0px;">
        <option ng-if="false"></option>
        <option ng-value=""></option>
        <option ng-value=""></option>
    </select>
</label>
    </div>
</div>
<div class="divider20"></div>
<div class="row row-white" ng-show="result"> <!-- Won't display!! -->
    <div class="col col-white">
        <input type="number">
    </div>
</div>

这是JS：

    $scope.list = [{
    "id": 1,
    "name": "Engångsnyckel"
}, {
    "id": 2,
    "name": "Fleragångsnyckel"
}]

$scope.myCtrl = function() {
    if ($scope.testValue.id == "2") {
        $scope.result = true
    }
    else {
        $scope.result = false
    }
}
// Sets the first index as placeholder
$scope.testValue = $scope.list[0]

对不起，如果这是一个愚蠢明显的问题，但我已经绝望了。

Answer 1

您的比较应该是数字

<p>
    @Html.DropDownList("Etat", EnumHelper.GetSelectList(typeof(StadeProg1)), "Etat", new { @class = "form-control" })
</p>

在你的

中使用track也很不错

$scope.myCtrl = function() {
    if ($scope.testValue.id == 2) {
        $scope.result = true
    }
    else {
        $scope.result = false
    }
}

Answer 2

我希望这会有所帮助。您可以直接使用数据绑定属性，而不依赖于静态条件的任何函数。

function TodoCtrl($scope) {
    $scope.list = [{
    "id": 1,
    "name": "The Id One"
}, {
    "id": 2,
    "name": "The Id Two"
}]
// Sets the first index as placeholder
$scope.testValue = $scope.list[0]
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app>
  <h2>Todo</h2>
  <div ng-controller="TodoCtrl">
   <div class="row row-white">
    <div class="col col-white">
<label>
    <select name="keys" ng-options="key.name for key in list" ng-model="testValue"  class="select-input" style="margin-left:0px;">
        <option ng-if="false"></option>
        <option ng-value=""></option>
        <option ng-value=""></option>
    </select>
</label>
    </div>
</div>
<div class="divider20"></div>
<div class="row row-white" ng-show="testValue.id==2"> <!-- Won't display!! -->
    <div class="col col-white">
        <input type="number" placeholder="Enter the number here">
    </div>
</div>
  </div>
</div>

选择选项时显示div标签Angular1

2 个答案: