角度1.x數組通過html表單推送多個變量

Question

我想通過我的數組中的HTML表單推送文本。問題是我看到的每個教程只解釋瞭如何添加一個變量。

我的數組： （這是我的意思）

$scope.titles = [{ 
    title: 'New Divide', 
    artist: 'Linkin Park', 
    album: 'New Divide', 
    genre: 'Rock', 
    cover: 'new-divide.jpg', 
    titleLength: '4:28', 
    file: 'test' 
}]; 

我的HTML表單：

<form ng-submit="musicController.addMusic(musicController.titles, musicController.artist, musicController.album, musicController.genre, musicController.titleLength, musicController.cover, musicController.file)"> 
     <input ng-model="musicController.title" type="text" /> 
     <input ng-model="musicController.artist" type="text" /> 
     <input ng-model="musicController.album" type="text" /> 
     <input ng-model="musicController.genre" type="text" /> 
     <input ng-model="musicController.titleLength" type="text" /> 
     <input ng-model="musicController.cover" type="text" /> 
     <input ng-model="musicController.file" type="text" /> 
     <button type="submit" class="btn btn-primary">Add</button> 
</form> 

Answer 1

應定義NG-模型爲您的每個輸入作爲對象屬性。這樣，他們都將在一個對象組合在一起，所以你不會有推每個單獨的值：

<form ng-submit="musicController.addMusic(musicController.record)"> 
     <input ng-model="musicController.record.title" type="text" /> 
     <input ng-model="musicController.record.artist" type="text" /> 
     <input ng-model="musicController.record.album" type="text" /> 
     <input ng-model="musicController.record.genre" type="text" /> 
     <input ng-model="musicController.record.titleLength" type="text" /> 
     <input ng-model="musicController.record.cover" type="text" /> 
     <input ng-model="musicController.record.file" type="text" /> 
     <button type="submit" class="btn btn-primary">Add</button> 
</form> 

只是爲了澄清，你addMusic功能看起來應該像下面這樣：

$scope.addMusic = function(record) { 
    $scope.titles.push(record); 
};