Question

我正在使用angularjs。

在我的HTML中，我有2个输入框

edit = false;

<input type="text" value=""  data-ng-if="edit" ng-model="name">
<input type="text" value="" data-ng-if="!edit" ng-model="singleAppDetails.name">

所以在这里我想根据某些条件一次只显示一个输入框。但我想ng-if不能正常工作。基本上如果编辑== true 我想显示 singleAppDetails.name ，如果编辑==错误然后名称

Answer 1

HTML DOM：

<div ng-app="myApp">
    <div ng-controller="testController">
        <input type="text" value=""  data-ng-if="edit" ng-model="name">
        <input type="text" value="" data-ng-if="!edit" ng-model="singleAppDetails.name">
    </div>
</div>

Angularjs：

   angular.module('myApp', [])
    .controller("testController", function($scope){
      $scope.singleAppDetails = {
        "name" : "name if not editable"
      }
      $scope.name = "name if editable";
      $scope.edit = false;
    })

示例：http://codepen.io/anon/pen/NqKQJO

Answer 2

你可以试试这个：

<input type="text" value=""  data-ng-if="edit" ng-model="(edit ? name : singleAppDetails.name)">

这样您只需使用输入来覆盖这两种情况。

Answer 3

<div ng-switch="edit">
    <div ng-switch-when='false'>
       <input type="text" value="" ng-model="singleAppDetails.name">
    </div>
    <div ng-switch-when='true'>
       <input type="text" value="" ng-model="name">
    </div>
</div>

如何使用ng-if和输入文本框以及ng-model？

3 个答案: