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

Question

I have a form in 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. 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

    <!-- 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

.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

  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){


}

Answer 1

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?). 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? If you set it in your controller and then catch the submit function like this then it will show data:

$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. 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.