Question

在我的Angular应用程序中，如果变量为true，我希望显示某个div，如果变量为false，则要消失。

但是，它不起作用。 See my Fiddle

任何人都可以帮我理解为什么吗？

HTML

<div ng-controller="MyCtrl">
    <div id="newProjectButton" class="project" ng-click="newProjectActive()" ng-if="!creatingNew">
            <h1> + </h1>
            <h3> New Project </h3>
    </div>
    <div id="newProjectActive" class="project" ng-if="creatingNew">
        <form>
            <input name="name" ng-model="newProjectName" type="text"></input>
            <button ng-click="newProject()" type="submit" class='btn btn-primary'>Save</button>
        </form>
    </div>
</div>

JS

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

function MyCtrl($scope) {
    $scope.name = 'Superhero';

    $scope.creatingNew = false;

    $scope.newProjectActive = function () {
        $scope.creatingNew = true;
    }

    $scope.newProject = function () {
        alert($scope.newProjectName);
    }

}

Answer 1

你的角度版本是1.0.1。指令ng-if不在此版本的角度中。它引入角1.1.5 检查这个article 和在Directives主题change log

下查看角度

AngularJS first added the ngIf directive in 1.1.5

请更新角度版

这是Demo

您的控制器应该像

myApp.controller("MyCtrl" , function($scope) {

因为默认情况下角度1.3 ... check this one

不支持全局控制器

Answer 2

首先，当我看着你的小提琴时，那里有你的例子的旧版本，

其次，实际上可能是一个原因，就是在那个例子中你在版本1.0.1中使用角度，我相信该版本没有实现ng-if。更新到最新版本将解决您的问题

为什么我的ng-如果不工作？它并没有隐藏div

2 个答案: