ng-click不会触发我的方法

我对AngularJS + Typescript如何协同工作感到非常兴奋。基本上我想实现的是对一个方法的简单调用。问题是我必须使用某种“架构”，我不知道我犯了什么错误。ng-click不会触发我的方法

这是我的接口（IAthorizathionScope.ts）：

 
module Main { 
    export interface IAuthorizationScope extends ng.IScope { 
     vm: AuthenticationController; 
     login: (username: string, password: string) => void; 
    } 
}

这是我的控制器（AuthorizationController.ts）：

 
module Main { 
    'use strict'; 

    export class AuthenticationController 
    { 
     public static $inject = [ 
      '$scope', 
     ]; 

     private username: string; 
     private password: string; 

     constructor($scope : IAuthorizationScope) 
     { 
      $scope.vm = this; 
     } 

     login = function (username:string, password:string) { 
      alert("authorised!"); 
     } 
    } 
}

，这是我的视图（secretTest .html）：

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
</head> 
<body> 
    <div ng-controller="AuthenticationController"> 
      <label>Username: <input type="text" ng-model="username"/> </label> 
      <label>Password: <input type="password" ng-model="password"/> </label> 
     <button ng-click="vm.login(username, password)"> 
      Login 
     </button> 
    </div> 
</body> 
</html>

编辑这是我的应用程序文件（的application.js）

 
module Main 
{ 
    'use strict'; 

    var txtmobileMvc = angular.module('txtmobileMvc', ['kendo.directives']) 
    // factories 
     .factory('Main.ItemCommonModel', function ($rootScope) 
     { 
      return new Main.ItemCommonModel($rootScope); 
     }) 
    // controllers 
     .controller('detailCollectionController', DetailCollectionController) 
     .controller('detailController', DetailController) 
     .controller('gridController', GridController) 
     .controller('authenticationController', AuthenticationController) 
     .controller('wijmoController', WijmoController) 
    // services 
     .service('itemStorage', ItemStorage) 
     .service('itemDataService', ItemDataService) 
    // Page routing 
     .config(($routeProvider: ng.IRouteProvider) => 
     { 
      $routeProvider 
       .when('/', { controller: 'detailController', templateUrl: 'views/detail.html' }) 
       .when('/grid', { controller: 'gridController', templateUrl: 'views/grid.html' }) 
       .when('/secret', { controller: AuthenticationController, templateUrl: 'views/secretTest.html'}) 
       .when('/wijmo', { controller: WijmoController, templateUrl: 'views/wijmoTest.html' }) 
       .otherwise({ redirectTo: '/' }); 
     }); 
}

也许我也搞不清楚这东西怎么在这里工作。预先感谢您。

来源

2014-01-30 davideberdin

看来你缺少[__ng-app__]（http://docs.angularjs.org/api/ng.directive:ngApp）指令。将此指令添加到'body'就像'' – Satpal

嗯 - 我不是打字员，但我确定登录在$范围内？如果没有，它不会触发..如果你console.log（$范围）会发生什么？是vm。在那里登录？ – alonisser

@Satpal是否需要在每个“视图”中放入ng-app指令，即使我使用$ routeProvider？因为我在某处读到，如果我只把它放在索引上，其他人就不需要它。我可能是错的 – davideberdin

基本上一个ng-app

此外，该控制器名称问题在于我将此代码添加到了我的HTML文件中

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
</head> 
<body>

和控制器无法启动我的方法。此外，我意识到，如果我的控制器添加到

 
angular.module(...).controller(...)

我不需要的NG控制器添加到HTML文件。有了这两件事，登录（）方法被ng-click启动。无论如何，谢谢你的帮助。

来源

2014-01-30 12:50:02 davideberdin

正如在评论中提及你缺少你注册.controller('authenticationController', AuthenticationController)应在NG-控制器匹配名称ng-controller="AuthenticationController"

我会做两AuthenticationController

来源

2014-01-30 11:36:47 basarat

ng-click不会触发我的方法

回答

相关问题