如何在ng-repeat中设置表单输入值?

时间:2016-06-26 16:46:56

标签: javascript html angularjs forms

我有一个来自Spotify的歌曲。对于ng-repeat中的每首歌曲,我想要一个表格,根据歌曲中的信息预先填充输入值。

以下是我的观点:

<div ng-repeat="song in spotifyResults">
    <h1>{{song.name}}<h1>
    <h2>Artist: {{song.artists[0].name}}</h2>      
    <h3>Album: {{song.album.name}}</h3> 
    <h4>{{song.id}}</h4>
    <iframe ng-src="{{getIframeSrc(song.id) | trusted}}" width="100%" height="50%" frameborder="0" allowtransparency="true"></iframe>

    <form class="form" name="form" ng-submit="selection.addSong(songName)" novalidate>
    <div class="form-group">
        <label>Name</label>
        <input type="text" value="{{song.name}}" name="songName" class="form-control" ng-model="songName" required/>
    </div>
    <button class="btn btn-primary">Save Song</button>
   </form>
<hr>
</div>

我可以使用repeat中的表达式成功设置输入的占位符,如下所示:

placeholder="{{song.name}}"

但我似乎无法像这样设置输入的值:

value="{{song.name}}"

如果我尝试使用表达式提交带有值集的表单,则传递给ng-submit函数的songName参数是未定义的。

如何在ng-repeat中设置默认表格输入值?

1 个答案:

答案 0 :(得分:1)

尝试将obj属性song.name直接传递给函数,并将输入的模型设置为song.name