私のangularjsのいくつかの奇妙な振る舞い

私はこのフィールドで新しくウェブサイトを作成しようとしていますが、私は1つの問題を抱えています。これはあなたのラップトップ上で実行することができます私のコードの簡易版である：私のangularjsのいくつかの奇妙な振る舞い

<!DOCTYPE html> 
<html lang="en" ng-app='myApp'> 
<head> 
    <meta charset="utf-8"> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
    <script src="js/all.js"></script> 
    <script> 
     var show=false 
     var notshow=true 
    </script> 
</head> 
<body ng-controller="mainControl"> 
     Hide HTML: <input type="checkbox" ng-model="myVar"> 
     <div ng-show="myVar"> 
      <button>Sign Up</button> 
      <button>Log In</button> 
     </div> 
     <div ng-show="show"> 
      <button>Sign Up</button> 
      <button>Log In</button> 
     </div> 
     <div ng-show="logged"> 
      <button>Sign Up</button> 
      <button>Log In</button> 
     </div> 
     <div ng-show="notshow"> 
      <button>Sign Up</button> 
      <button>Log In</button> 
     </div> 
     <div ng-show="visiter"> 
      <button>Sign Up</button> 
      <button>Log In</button> 
     </div> 

</body> 
</html>

て、myAppとall.jsについて、私はそれについてあまり書きませんでした。

(function(){ 
    angular.module('myApp',[]) 
})() 

(function(){ 
    'use strict'; 
    angular.module('myApp').controller('mainControl',function($scope){ 
     $scope.logged=false; 
     $scope.visiter=true; 
    }) 
})()

実行すると、5つのng-showがまったく動作しないことがわかります。 ng-controller="mainControl"を削除した場合、最初のng-showは正常に動作しますが、他のng-showはうまく動作しません。私は長い間試してきましたが、これで何のルールも見つけられません。このコードを変更して正しいバージョンを教えてください。または私のコードに何が間違っているか教えてください。

出典

2016-11-01 Weiheng Li

この多くのng-showを使用する要件は何ですか？実際には – Sajeetharan

が必要ですが、変数の使用についていくつかのテストを行っています –

それは、ここにも

var app = angular.module('myApp', []); 
app.controller('mainControl', function($scope) { 
    $scope.logged = false; 
    $scope.visiter = true; 
})

HTML

<body ng-controller="mainControl"> 
    Hide HTML: 
    <input type="checkbox" ng-model="myVar"> 
    <div ng-show="myVar"> 
    <button>Sign Up</button> 
    <button>Log In</button> 
    </div> 
    <div ng-show="show"> 
    <button>Sign Up</button> 
    <button>Log In</button> 
    </div> 
    <div ng-show="logged"> 
    <button>Sign Up</button> 
    <button>Log In</button> 
    </div> 
    <div ng-show="notshow"> 
    <button>Sign Up</button> 
    <button>Log In</button> 
    </div> 
    <div ng-show="visiter"> 
    <button>Sign Up</button> 
    <button>Log In</button> 
    </div> 
</body>

DEMO

出典

2016-11-01 04:37:53 Sajeetharan

に動作します私はJavaScriptを使用して熟練していないので、私はそれにコメントすることはできません

(function(){... code ...})())

パターンを使用していますが、2番目のブロックには()が表示されています。

出典

2016-11-01 04:38:49 arrowd

はい、そうです。実際、私はまた無視する ';' –

私は2つの答えを受け入れることができないので、私はあなたにupvoteを与える。 –

私のangularjsのいくつかの奇妙な振る舞い

答えて

関連する問題