javascript - Ng-Model 与 Ng-If 不起作用(非常基本的示例)

标签 javascript html angularjs

我有这个非常简单的代码。 filterOption = 'Account ID'当值正确时就会出现输入。但是ng-model不起作用,我在 pre 中没有看到任何内容

<pre>{{test}}</pre> // doesnt work
<pre> {{filterOption}}</pre> // this shows Account ID
<input ng-if="filterOption == 'Account ID'" ng-model="test" required>

最佳答案

确定 Controller 的范围并使用controllerAs分配它们可以解决这个问题。请参阅https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md以获得更好的编码风格,这样您就不会遇到这些问题。

<!DOCTYPE html>
<html ng-app="abc">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>

<div ng-controller="MyCtrl as vm">
<pre>{{vm.test}}</pre> // doesnt work
<pre> {{vm.filterOption}}</pre> // this shows Account ID
<input ng-if="vm.filterOption === 'Account ID'" ng-model="vm.test" required>

</div>
<script>

var app=angular.module('abc',[]);

app.controller('MyCtrl',MyCtrl);

function MyCtrl($scope){
 var vm = this;
 vm.filterOption = "Account ID";
}

</script>

关于javascript - Ng-Model 与 Ng-If 不起作用(非常基本的示例),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51080363/

相关文章:

JavaScript 删除确认框

javascript - 增加弹出背景的高度

jquery - 我想在点击输入时显示文本

javascript - AngularJS Controller 的变量未更新

javascript - 如何在 Titanium 中并排显示两个 ImageView

javascript - 我如何在 caporal js 中打印数字

javascript - 如何为图标创建事件监听器?

html - CSS3 如果屏幕尺寸大于 x,则不显示 DIV

javascript - ionic map Controller 未加载

javascript - Angular 中的简单哈希爆炸示例。为什么它不起作用?