使用带有动态数据的angularjs在选择框中选择所选项目

时间:2015-09-12 16:49:50

标签: angularjs

在html页面中,我选择一个选择框并通过从数据库中提取记录来将数据放入其中。

<select id="category" ng-model="eventAdd.data.selCategory" ng-change="changeBg(eventAdd.data.selCategory)">
   <option value="">-Select-</option>
   <option ng-repeat="photo in photos"
           value="{{photo.PhotoId}}">
           {{photo.Category}}
   </option>
   <option value="other">Other</option>
</select>

在选择框中我添加一个选项“其他”如果用户选择该选项,我将显示一个输入框,用户可以输入自定义名称,我将推送它$ scope.photos,它将显示在选择框中,但它可能不是被选中。

Photo.allCategory().then(function(photos)
{
    $timeout(function() 
    {
        $scope.photos = photos;
    },0);
});


$scope.changeBg = function(val)
{
    if(val=="other")
    {
        $cordovaDialogs.prompt('Category name', 'Category', ['Ok','Cancel'], '')
        .then(function(result) 
        {
            console.log("call");
            var input = result['input1'];
            $scope.photos.push({photoId:9,Category:input});
            $scope.eventAdd.data.selCategory = 8;
        });
    }
}

使用此行

$scope.eventAdd.data.selCategory = 3;

可以选择第三个i项目,但是当我这样做时

$scope.eventAdd.data.selCategory = $scope.photos.length;

无法选择最后一个在提示中添加的内容。

请按代码检查

http://codepen.io/pareshgami/pen/BooEap

请帮忙。谢谢你的时间。

0 个答案:

没有答案