ng-click和ng-submit不起作用

我有一個帶有phonegap的角度應用程序，我有一個登錄窗體和登錄控制器。ng-click和ng-submit不起作用

問題是ng-submit不起作用。通常情況下，調用函數formConnexion（）但沒有任何反應。所以，我試着只是一個警報，但它是相同的結果...

我試着用ng-click和相同的結果。然後，我想嘗試在模板範圍（$ scope.test）中調用一個示例變量，並且它不顯示。而當我登錄頁面時，console.log（'salut !!'）不顯示。

這使我認爲我的控制器不會與模板關聯。但我在我的div中的ng控制器與好名稱控制器。

的話，我認爲角是被安裝差，但由於沒有其他指示工作（NG-IF，NG-SRC，...）

所以，如果你有一個想法來解決這個問題，我不介意:)

這裏爲模板的代碼：

的login.html

<div class="row jumbotron" style="margin:10px" ng-controller="LoginCtrl"> 
    <div class="col-lg-8 col-lg-offset-2 col-md-8 col-md-offset-2 col-sm-8 col-sm-offset-2 col-xs-8 col-xs-offset-2"> 
     <h1>{{ test }}</h1> 
     <form class="form-horizontal" ng-submit="alert('alert')"> 
      <div class="form-group"> 
       <label for="login" class="control-label">Login</label> 
       <input type="text" name="login" class="form-control" ng-model="formData.login"> 
      </div> 
      <div class="form-group"> 
       <label for="password" class="control-label">Password</label> 
       <input type="password" name="password" class="form-control" ng-model="formData.password"> 
      </div> 
      <button type="submit" class="btn btn-md btn-success">Connexion</button> 
     </form> 
     <a href="" ng-click="alert('lalalala')">click</a> 
     <img ng-src="images/accueil.png" class="accueil img-responsive"> 
    </div> 
</div>

這裏的續輥：

login.js

'use strict'; 

appStat.controller('LoginCtrl', function ($scope, $rootScope, $http, $location) { 
    console.log("salut!!"); 
    $scope.formData = {}; 
    $scope.test = "test"; 
    $scope.toto = function() { alert('alert'); }; 

    /** 
    * Connect l'user 
    */ 
    $scope.formConnexion = function() {...} 

    });

這裏我app.js： app.js

'use strict'; 

var appStat = angular.module('posStatsPhoneGap', [ 
    'ngCookies', 
    'ngResource', 
    'ngSanitize', 
    'ngRoute', 
    'ngResource', 
    'ui.bootstrap', 
    'ngMessages', 
    'ngAnimate', 
    'ngAria', 
    'ngTouch', 
    'picardy.fontawesome' 
]) 
    .config(['$routeProvider', '$compileProvider', function ($routeProvider, $compileProvider) { 

     $compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|file|tel):/); 
     $compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|file|tel):/); 

     $routeProvider 
      .when('/', { 
       templateUrl: 'views/login.html', 
       controller: 'LoginCtrl' 
       }) 
      .when('/main', { 
       templateUrl: 'views/main.html', 
       controller: 'MainCtrl' 
       }) 
      .when('/stat', { 
       templateUrl: 'views/stat.html', 
       controller: 'StatCtrl' 
       }) 
       .otherwise({ 
       redirectTo: '/' 
       }); 

    } 
]);

預先感謝您！

來源

2015-10-20 Thibaud Ledeux

你在你的JS聲明你的應用程序代碼，在你的控制器之上，就像這樣：'var myApp = angular.module（'myApp'，[]）;'我在您發佈的代碼中看不到這一點。 – Skywalker

請參閱下面的答案。 – Skywalker

也沒有關閉輸入標籤你需要/>在最後 – Radu

從我的意見之後嘗試是這樣的：

創建一個控制器文件&內它的控制器控制器文件

中創建一個角度

模塊創建一個controller.js文件，然後創建一個角度模塊，請參閱下面的代碼：

//Within your controller.js file var myApp = angular.module('myApp', []); myApp.controller('myController', function($scope, $http){ $scope.Data = "Alert Alert"; // Create a function within the scope of the module $scope.myFunc = function(){ alert($scope.Data) }; });

那麼你的HTML文件中調用函數上，點擊看下面的代碼：

注：請不要忘記添加你到你的HTML代碼創建的控制器。我通常在body標籤添加它

<body ng-controller="myController"> <button ng-click="myFunc()">Make Request Button</button> </body>

在這裏看到一個活生生的例子：

http://plnkr.co/edit/sQ0z7TlyWv5fM5XyfujK?p=preview

另外一張紙條： NG-點擊大多用於任何點擊事件，你正在嘗試在你的角度應用程序內執行，但ng-submit主要在使用HTML表單提交時使用。

來源

2015-10-20 14:52:38 Skywalker

我在說明中添加了app.js :)我會盡力回覆。 –

你的例子工作！ :)但我沒有看到我的控制器和你的區別：/ –

@ThibaudLedeux你可以請選擇這個作爲答案，如果它幫助你。 – Skywalker

使用NG提交你的形成：

<form ng-submit="submit()">

function Ctrl($scope) { 
 
    $scope.list = []; 
 
    $scope.text = 'hello'; 
 
    $scope.submit = function() { 
 
     if ($scope.text) { 
 
      $scope.list.push($scope.text); 
 
      $scope.text = ''; 
 
     } 
 
    }; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app> 
 
    <div ng-controller="Ctrl"> 
 
     <form ng-submit="submit()">Enter text and hit enter: 
 
      <input type="text" ng-model="text" name="text" /> 
 
      <input type="submit" id="submit" value="Submit" /> <pre>list={{list}}</pre> 
 

 
     </form> 
 
     <button ng-click="submit()">Submit 2</button> 
 
    </div> 
 
</div>

來源

2015-10-20 14:56:43

謝謝，但我用相同的方式ng-submit（在窗體標籤）:) –

我發現的錯誤。這是由於有兩個名爲'LoginCtrl'的控制器造成的。這是一個愚蠢的複製/粘貼錯誤。

來源

2015-10-20 15:51:34

我已經創建了一個工作代碼爲4種不同類型的HTML元素的上述問題，爲完整的代碼，請按照下面的網址 -

http://plnkr.co/edit/Tm2Rtbt3xsv4pKzcPQCw?p=preview

<body ng-controller="ExampleController"> 
    <button ng-click="setButton()">set button</button> 
    <div content="snippetContentFirst"></div> 
    <div content="snippetContentSecond"></div> 
    <div content="snippetContentThird"></div> 
    <div> 
     <ul content="snippetContentFour"></ul> 
    </div> 
</body>

來源

2015-11-16 12:06:27 Madhab

ng-click和ng-submit不起作用

回答

相關問題