模型更新后,ng-hide / ng-show不起作用

时间:2014-11-11 20:53:26

标签: angularjs

我有以下

var model = 
{
 UserInfo :null ,
 PlatformID : 1
}
var myApp = angular.module("myApp", []);

myApp.controller("UCtrl",['$scope','$http','$window', function ($scope, $http,$window) { 
$scope.Info =model ;
$scope.SearchUser = function() {
           $http({
            method:"POST",
            url : '/FindUser',
            data: {UserID : 9999}

        }).success(function(data){

            $scope.Info.UserInfo = data;

        });

    };
});

<div ng-hide="{{Info.UserInfo === null}}" >

</div>

当搜索用户时,Info.User会通过$ http post via

更新
$scope.Info.User = data ; 

即使有数据,在将数据分配给Info.User对象后,ng-hide部分也不会显示。

2 个答案:

答案 0 :(得分:0)

请勿在ng-if中使用{{}}。表达式无论如何都会执行:

<!doctype html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.js"></script>
</head>
<body ng-app="Example">
    <div data-ng-controller="Cntrl">
        <div ng-hide="UserInfo === null" >
            User info
        </div>
        <button data-ng-click="toggle()">Toggle</button>
    </div>
    <script>
        var app = angular.module("Example", [])
        .controller("Cntrl", function ($scope) {
            $scope.UserInfo = null;
            $scope.toggle = function () {
                if ($scope.UserInfo === null) {
                    $scope.UserInfo = 'some value';
                } else {
                    $scope.UserInfo = null;
                }
            };
        });
    </script>
</body>
</html>

答案 1 :(得分:0)

编辑:这是另一个代码更像你的代码:http://jsfiddle.net/kpLe544u/3/

我认为问题在于您尚未在HTML中声明控制器,因此您无法从该div访问变量Info.UserInfo。

摘自我的小提琴:( http://jsfiddle.net/kpLe544u/2/

<强> HTML

<div ng-app>
  <div ng-controller="MyCtrl">
      <div ng-show="Info.User">data here</div>
      <div ng-show="Info.Test">this won't show</div>
  </div>
</div>

<强> controller.js

function MyCtrl($scope) {
  $scope.Info = {}; 
  $scope.Info.User = "blah blah";
  $scope.Info.Test = null;
}