简体   繁体   English

Angular.js ng-submit触发两次,但未从表单获取值

[英]Angular.js ng-submit fired twice and didn't get the values from form

I have a form in angularjs 我在angularjs中有一个表单

<form ng-submit="addNewNote(noteData)">
        <button type="submit"  class="md-icon-button ion-nav-button-right md-button md-default-theme" aria-label="Setting" tabindex="0">
            {{noteTxt}}
        </button> 
 <ion-content>
<div id="note-detail-content">
                <md-input-container md-no-float>
                    <input required name="noteTitle" placeholder="Note Title (Required)" ng-model="noteData.title">
                </md-input-container>
                <textarea rows="7" ng-model="noteData.description" maxlength="250"
                          placeholder="Write something here ...."></textarea>
                <span>
                </span>
            </div><!--end content section-->
        </ion-content>
    <!--end note detail section-->
      </form>

The problem is ng-submit fired two times, also noteData.title doesn't read any value even if a value is present. 问题是ng-submit触发了两次,即使存在值, noteData.title也不读取任何值。 I'm getting this error 我收到这个错误

Cannot read property 'title' of undefined

I've checked this question but my code doesn't include angular twice, if it is, how can i check it? 我已经检查了这个问题,但是我的代码没有两次包含角度,如果是,我该如何检查?

$scope.addNewNote=function(noteData){
    alert(noteData.title);
}

index.html links index.html链接

    <!-- Ionic javascript lib -->
    <script src="lib/ionic/js/ionic.bundle.js"></script>
    <!-- end Ionic javascript lib -->

    <!-- Angular javascript lib -->
    <script src="lib/angular-messages.js"></script>
    <script src="lib/angular-aria.js"></script>
    <script src="lib/angular-material.js"></script>
    <!-- end Angular javascript lib -->

    <!-- Cordova script (this will be a 404 during development) -->
    <script src="lib/ng-cordova.js"></script>
    <script src="cordova.js"></script>

UPDATE app.js file 更新 app.js文件

.state('app.addnote', {
                url: "/addnote",
                cache: false,
                views: {
                    'menuContent': {
                        templateUrl: "templates/note/html/note-add.html",
                        controller: 'AddNotesCtrl'
                    }
                }
            })
            .state('app.notelist', {
                url: "/notelist",
                params:{
                    isAnimated:true
                },
                cache: false,
                views: {
                    'menuContent': {
                        templateUrl: "templates/application-storage/local-application-db/html/note-list.html",
                        controller: 'noteListCtrl'
                    }
                }
            }

)

Controller.js Controller.js

  var appControllers = angular.module('starter.controllers', []); // Use for all controller of application.
    var appServices = angular.module('starter.services', []);// Use for all service of application.

appControllers.controller('AddNotesCtrl',function($scope,$rootScope,$state,$mdToast){


}

I don't know why it would fire/submit twice (Are you sure there is no double function declarations or declaring the controller twice for example in html and routes etc?). 我不知道为什么它会触发/提交两次(您确定没有双重函数声明或两次声明控制器,例如在html和route等中?)。 It does not do that for me, but for the second problem that it does not submit the data. 它对我来说不是这样做的,但是对于第二个问题,它不提交数据。 Have you declared the variable noteData anywhere in your controller? 您是否在控制器的任何地方声明了变量noteData If you set it in your controller and then catch the submit function like this then it will show data: 如果您在控制器中对其进行设置,然后捕获这样的Submit函数,则它将显示数据:

$scope.noteData = [];

$scope.addNewNote = function(noteData) {
  console.log('form submitted');
  console.log(noteData);
};

EDIT: 编辑:

Please check this post on SO for the problem that the form is submitted twice. 请检查SO上的此帖子以解决表单提交两次的问题。 Your problem is not duplicating with the code you provided in your question so you must have something else somewhere that is causing this problem. 您的问题不是与问题中提供的代码重复,因此您必须在其他地方导致此问题。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM