2017-04-12 11 views
0

私はAngularjsを初めて使っていて、いくつかのタスクを実行して練習しています。ここで私はコントローラーのオブジェクトと私のWebページのオブジェクトの値を作成しています。しかしここでは、ng-showは以下の式を評価しません。しかし、コントローラに変数を作成した場合、$ scope.ngshow = false;それは動作します。以下のコードがうまくいかなかったのをなぜ助けてください。ng-showは式を評価しません

<!DOCTYPE html> 
<html> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
<body> 

<div ng-app="myApp" ng-controller="myCtrl"> 
<ul> 

<li ng-show = "a.name"> Name {{a.name}} </li> 
<li ng-show = "a.id"> Id {{a.id}}</li> 
<li ng-show = "a.address"> Address {{a.address}}</li> 
</ul> 
</div> 

<script> 
var app = angular.module('myApp', []); 
app.controller('myCtrl', function($scope) { 
    $scope.a = { 
    'name' : 'false', 
    'id' : 'true', 
    'address' : 'false' 
    }; 
}); 
</script> 

<p>ng-show didnt accept expressions.</p> 

</body> 
</html> 

あなたの貴重な時間をありがとう。

+0

文字列としてtrueまたはfalseを使用しないでください。引用符を削除してください。 – Phantom

答えて

1

あなたはちょうどあなたがtruefalseに引用符を入れて.IF truefalseから単一引用符を削除した文字列

var app = angular.module('myApp', []); 
 
app.controller('myCtrl', function($scope) { 
 
    $scope.a = { 
 
    'name' : false, 
 
    'id' : true, 
 
    'address' : false 
 
    }; 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 

 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
<ul> 
 

 
<li ng-show = "a.name"> Name {{a.name}} </li> 
 
<li ng-show = "a.id"> Id {{a.id}}</li> 
 
<li ng-show = "a.address"> Address {{a.address}}</li> 
 
</ul> 
 
</div> 
 

 
<script> 
 

 
</script> 
 

 
<p>ng-show didnt accept expressions.</p>

+0

ありがとう:-) – User12345

0

としてtrueまたはfalseを使用しないでください、彼らはstrings.Inですその場合ng-showは変数が定義されているかどうかを確認しています。あなたのケースでは、文字列の真偽値があるので、ng-showは式aを考えていますそれゆえ真であると定義される。

<!DOCTYPE html> 
 
<html> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 

 
<body> 
 

 
    <div ng-app="myApp" ng-controller="myCtrl"> 
 
    <ul> 
 

 
     <li ng-show="a.name"> Name {{a.name}} </li> 
 
     <li ng-show="a.id"> Id {{a.id}}</li> 
 
     <li ng-show="a.address"> Address {{a.address}}</li> 
 
    </ul> 
 
    </div> 
 

 
    <script> 
 
    var app = angular.module('myApp', []); 
 
    app.controller('myCtrl', function($scope) { 
 
     $scope.a = { 
 
     'name': false, 
 
     'id': true, 
 
     'address': false 
 
     }; 
 
    }); 
 
    </script> 
 

 
    <p>ng-show didnt accept expressions.</p> 
 

 
</body> 
 

 
</html>

0

だけでなく、apperenlyそれはバージョンの競合です。角度バージョンのこのバージョン1.4.8はサポート値をブール値ではなく文字列ブール値として表示します。あなたは1.2.23のような下位バージョンを使用しているのであれば、あなたはその後、角度値

$scope.a = { 
     'name' : false, 
     'id' : true, 
     'address' : false 
     }; 

var app = angular.module('myApp', []); 
 
app.controller('myCtrl', function($scope) { 
 
    $scope.a = { 
 
    'name' : false, 
 
    'id' : true, 
 
    'address' : false 
 
    }; 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 

 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
<ul> 
 

 
<li ng-show = "a.name"> Name {{a.name}} </li> 
 
<li ng-show = "a.id"> Id {{a.id}}</li> 
 
<li ng-show = "a.address"> Address {{a.address}}</li> 
 
</ul> 
 
</div>

前後に引用符を削除する必要がありますが、値がtrueまたはfalseの場合、ブールなどの文字列値を識別

var app = angular.module('myApp', []); 
 
app.controller('myCtrl', function($scope) { 
 
    $scope.a = { 
 
    'name' : 'false', 
 
    'id' : 'true', 
 
    'address' : 'false' 
 
    }; 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myCtrl"> 
 
<ul> 
 

 
<li ng-show = "a.name"> Name {{a.name}} </li> 
 
<li ng-show = "a.id"> Id {{a.id}}</li> 
 
<li ng-show = "a.address"> Address {{a.address}}</li> 
 
</ul> 
 
</div>