當提交表單不調用控制器功能

當點擊提交按鈕auth函數沒有被調用，我一直無法找出原因。當提交表單不調用控制器功能

HTML模板，用於所有的網頁：

<!DOCTYPE html> 
<html ng-app ="myApp"> 
<head> 
<meta charset="utf-8" /> 
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
<title>MyApp @ViewBag.Title</title> 

<link href="~/Content/bootstrap.min.css" rel="stylesheet" type="text/css" /> 
<link href="~/Content/Site.css" rel="stylesheet" type="text/css" /> 
<script src="~/Scripts/modernizr-2.6.2.js"></script> 
<script src="~/Scripts/jquery-1.10.2.min.js"></script> 
<script src="~/Scripts/bootstrap.min.js"></script> 
<script src="~/Scripts/angular.min.js"></script> 
<script src="~/js/Login.js"></script> 
</head> 
<body> 
<div class="navbar navbar-inverse navbar-fixed-top"> 
    <div class="container"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
      </button> 
      @Html.ActionLink("myApp", "Index", "Home", null, new { @class = "navbar-brand" }) 
     </div> 
     <div class="navbar-collapse collapse"> 
      <ul class="nav navbar-nav"> 
      </ul> 
     </div> 
    </div> 
</div> 

<div class="container body-content"> 
    @RenderBody() 
    <hr /> 
    <footer> 
     <p>&copy; @DateTime.Now.Year - myApp</p> 
    </footer> 
</div> 


</body> 
</html>

HTML此頁面查看：

@{ 
    ViewBag.Title = "Login"; 
    Layout = "~/Views/Shared/_Layout.cshtml"; 
} 

<h2></h2> 
<div id="loginBox"> 
    <auth-modal></auth-modal> 
</div>

這裏是自定義指令的HTML：

<div class="modal fade"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
      <h4 class="modal-title"></h4> 
     </div> 
     <div class="modal-body"> 
      <form class="form-signin" name="authForm" ng-submit="auth()" ng-controller ="AuthController" novalidate> 
       <input type="text" class="form-control" placeholder="user name" ng-model ="AuthController.user.username" required autofocus> 
       <input type="password" class="form-control" placeholder="password" ng-model ="AuthController.user.password" required> 
       <input type="submit" class="btn btn-primary" value="Submit" /> 
      </form> 
     </div> 
    </div><!-- /.modal-content --> 
</div><!-- /.modal-dialog -->

這裏我S中的JS：

(function() { 
var MyApp = angular.module('MyApp', []); 

MyApp.controller('AuthModalController', function() { 
    MyApp.user = {}; 
    console.log("AuthModalController ran"); 
    $(".modal").modal({}); 
}); 

MyApp.directive("authModal", function() { 
    return { restrict: 'E', templateUrl: '\\js\\templates\\auth-modal.html', controller: 'AuthModalController',controllerAs: 'authmodalCtrl'} 
}); 

MyApp.controller('AuthController',function() { 
    this.user = {}; 
    console.log("AuthController ran"); 
    this.auth = function() { 
     console.log("user " + this.user); 

    }; 
}); 
})();

MVC 5控制器：

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.Web.Mvc; 

namespace MyApp.Controllers 
{ 
    public class MyAppController : Controller 
    { 
     // 
     // GET: /MyApp/ 
     public ActionResult Index() 
     { 
      return View(); 
     } 
    } 
}

來源

2014-10-26 Timigen

需要你的控制器代碼。 – 2014-10-26 17:45:23

@CBauer它是我發佈的最後一個代碼塊 – Timigen 2014-10-26 17:45:57

@CBauer我添加了MVC 5控制器代碼，據我所知這是正確的... – Timigen 2014-10-26 17:51:50

編輯：我將在這裏我不能讓下面的代碼鏈接運行，除了通過加入NG-應用= 「app-name-from-module」指令與表單對象上的控制器聲明並不在鏈接的angular-js文檔中！

閱讀只是我注意到不少問題，

1） ~~你宣稱「對myApp」，用「MyApp的」，除非這就是模糊處理錯誤的文檔。~~

2）我覺得你的控制器是按照文檔中缺少了一些東西（ESP $範圍變量，https://docs.angularjs.org/guide/controller）

2A）你不重視的AUTH功能到$範圍

3 ）.controller似乎將字符串和數組作爲參數，而不是通用函數。

每頁：https://docs.angularjs.org/api/ng/directive/ngSubmit

<script> 
    angular.module('submitExample', []) 
    .controller('ExampleController', ['$scope', function($scope) { 
     $scope.list = []; 
     $scope.text = 'hello'; 
     $scope.submit = function() { 
     if ($scope.text) { 
      $scope.list.push(this.text); 
      $scope.text = ''; 
     } 
     }; 
    }]); 
</script> 
<form ng-app="submitExample" ng-submit="submit()" ng-controller="ExampleController"> 
    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>

來源

2014-10-26 18:06:38

我在文檔中看到過，當我這樣做時，我收到$ scoipe未定義的錯誤消息，我將在一分鐘內得到確切的錯誤消息... – Timigen 2014-10-26 18:19:15

當提交表單不調用控制器功能

回答

相關問題