AngularJs控制器數據的HTML指令不可見

我做了一個登錄指令看起來像這樣：AngularJs控制器數據的HTML指令不可見

指令登錄

(function() { 
     'use strict'; 

     angular 
      .module('lnjapp.login',[]) 
      .directive('login', login); 

     function login() { 
      var directive = { 
       templateUrl: '/app/components/login/login.html', 
       restrict: 'E', 
       Controller: login.controller, 
       controllerAs: 'vm' 
      }; 
      return directive; 
     } 
    })();

login.controller

(function() { 
    'use strict'; 

    angular 
     .module('lnjapp.login') 
     .controller('loginController', loginController); 

    function loginController() 
    { 
     var vm = this; 
     vm.test = 'test'; 
    } 
})();

login.html

 <div class="form-group pull-left"> 
      <label> 
       <b>d{{ vm.test }}</b> 
       <input type="checkbox" name="remember">&nbsp;&nbsp;&nbsp;&nbsp;Onhoud mij 
      </label> 
      <br> 
      <a ng-href="#/wachtwoord/vergeten">Wachtwoord Vergeten?</a> 
     </div>

在login.htmlvm.test是空的嗎？

這裏有什麼問題？

在指令

來源

2016-05-23 Jamie

swap login.controller'loginController' – Lucas

這裏有兩個問題：1。控制器名稱是在指令 2.控制器的名稱應該是在單引號不正確

嘗試下面的代碼：

(function() { 
     'use strict'; 

     angular 
      .module('lnjapp.login',[]) 
      .directive('login', login) 
      .controller('loginController', loginController); 

      function loginController() 
      { 
       var vm = this; 
       vm.test = 'test'; 
      }; 

     function login() { 
      var directive = { 
       templateUrl: '/app/components/login/login.html', 
       restrict: 'E', 
       controller: 'loginController', 
       controllerAs: 'vm' 
      }; 
      return directive; 
     } 
    })();

來源

2016-05-23 14:52:07

Thankyou這工作。但是當我把控制器放在一個單獨的文件中時，它不是？控制器鏈接在我的index.html – Jamie

是的，這可能會發生，原因是，當您創建控制器是一個單獨的文件，因爲您正在一個單獨的文件中創建'lnjapp.login'模塊，因此可能會出現' lnjapp.login'模塊不可用，我們正在創建控制器。因此，如果您決定將控制器和服務放在不同的文件中，那麼您必須確保在添加控制器/服務之前，模塊已創建並可以使用。 –

把它放在同一個文件中是不好的做法嗎？ – Jamie

應該是一個變量名而不是文件名

(function() { 
    'use strict'; 

    angular 
     .module('lnjapp.login',[]) 
     .directive('login', login); 
    function loginController() 
    { 
     var vm = this; 
     vm.test = 'test'; 
    } 
    function login() { 
     var directive = { 
      templateUrl: '/app/components/login/login.html', 
      restrict: 'E', 
      Controller: loginController, 
      controllerAs: 'vm' 
     }; 
     return directive; 
    } 
})();

來源

2016-05-23 14:47:07 AlainIb

爲了從查看接入控制器的數據，你應該把它綁定到的範圍。所以在你的情況下，你應該使用$scope.vm = "test";，並在視圖中只使用{{vm}}應該做的伎倆，據我所知。

有關AngularJS的雙向數據綁定看到進一步的信息：https://docs.angularjs.org/tutorial/step_04

來源

2016-05-23 14:49:44

AngularJs控制器數據的HTML指令不可見

回答

相關問題