在 ng-if 中使用 ng-model 的值
Using value of ng-model in ng-if
我有一个输入 idNumber 的文本框。我想检查该 ID 号码是否出现在我的 table 中。如果是这样,我想在该行中添加一个字形图标。
现在,我的问题是我不知道如何从 ng-if 访问 ng-model="idNumber"
。
我尝试使用 ng-if="data.id== {{idNumber}}"
但它不起作用。
<div class="container" id="inputDiv">
<div>
<input type="text" class="form-control" ng-model="idNumber">
</div>
</div>
<div class="container col-md-12">
<table class="table table-hover">
<thead>
<tr>
<th>Id number</th>
<th>Name</th>
<th>Type</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="data in idData">
<td>{{data.id}}</td>
<td>{{data.name}}</td>
<td>{{data.dokumenttype}}</td>
<td>
<span ng-if="data.id== {{idNumber}}">
<span class="glyphicon glyphicon-asterisk"></span>
</span>
</td>
</tr>
</tbody>
</table>
</div>
这样使用:
<span ng-if="data.id === idNumber">
你不需要在这里放一个表达式,只需将它替换为,
<span ng-if="data.id===idNumber">
<span class="glyphicon glyphicon-asterisk"></span>
</span>
演示
var myApp=angular.module('myApp',[]);
myApp.controller('thecontroller',function($scope){
$scope.idData = [{
"id": "1",
"name": "Kimberlyn",
"documentType": "McGaw"
}, {
"id": "2",
"name": "Harmony",
"documentType": "Sedworth"
}, {
"id": "3",
"name": "Adela",
"documentType": "Blenkin"
}];
});
<!DOCTYPE html>
<html>
<head>
<title>ng-Messages Service</title>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>
<script src='https://code.angularjs.org/1.5.0-rc.0/angular.min.js'></script>
</head>
<body ng-app="myApp">
<div ng-controller='thecontroller'>
<div class="container" id="inputDiv">
<div>
<input type="text" class="form-control" ng-model="idNumber">
</div>
</div>
<div class="container col-md-12">
<table class="table table-hover">
<thead>
<tr>
<th>Id number</th>
<th>Name</th>
<th>Type</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="data in idData">
<td>{{data.id}}</td>
<td>{{data.name}}</td>
<td>{{data.dokumenttype}}</td>
<td>
<span ng-if="data.id === idNumber">
<span>test</span>
</span>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
</html>
我有一个输入 idNumber 的文本框。我想检查该 ID 号码是否出现在我的 table 中。如果是这样,我想在该行中添加一个字形图标。
现在,我的问题是我不知道如何从 ng-if 访问 ng-model="idNumber"
。
我尝试使用 ng-if="data.id== {{idNumber}}"
但它不起作用。
<div class="container" id="inputDiv">
<div>
<input type="text" class="form-control" ng-model="idNumber">
</div>
</div>
<div class="container col-md-12">
<table class="table table-hover">
<thead>
<tr>
<th>Id number</th>
<th>Name</th>
<th>Type</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="data in idData">
<td>{{data.id}}</td>
<td>{{data.name}}</td>
<td>{{data.dokumenttype}}</td>
<td>
<span ng-if="data.id== {{idNumber}}">
<span class="glyphicon glyphicon-asterisk"></span>
</span>
</td>
</tr>
</tbody>
</table>
</div>
这样使用:
<span ng-if="data.id === idNumber">
你不需要在这里放一个表达式,只需将它替换为,
<span ng-if="data.id===idNumber">
<span class="glyphicon glyphicon-asterisk"></span>
</span>
演示
var myApp=angular.module('myApp',[]);
myApp.controller('thecontroller',function($scope){
$scope.idData = [{
"id": "1",
"name": "Kimberlyn",
"documentType": "McGaw"
}, {
"id": "2",
"name": "Harmony",
"documentType": "Sedworth"
}, {
"id": "3",
"name": "Adela",
"documentType": "Blenkin"
}];
});
<!DOCTYPE html>
<html>
<head>
<title>ng-Messages Service</title>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>
<script src='https://code.angularjs.org/1.5.0-rc.0/angular.min.js'></script>
</head>
<body ng-app="myApp">
<div ng-controller='thecontroller'>
<div class="container" id="inputDiv">
<div>
<input type="text" class="form-control" ng-model="idNumber">
</div>
</div>
<div class="container col-md-12">
<table class="table table-hover">
<thead>
<tr>
<th>Id number</th>
<th>Name</th>
<th>Type</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="data in idData">
<td>{{data.id}}</td>
<td>{{data.name}}</td>
<td>{{data.dokumenttype}}</td>
<td>
<span ng-if="data.id === idNumber">
<span>test</span>
</span>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
</html>