javascript - 如何在 Angular 中为多选选择标签设置多个默认值

Question

如何在 Angular 中为多选选择标签设置多个默认值？这是我的标签:

 <select multiple="multiple"
            class="form-control multiselect"
            ng-model="dog.Tags"
            ng-options="tag as tag.Name for tag in tagsAvailable">
 </select>

我在 Controller 中调用的服务中有一个 ajax 调用，该调用返回 Dog 对象。 Dog 对象看起来像:

{ID: 1, Name: "Lassie", Tags: [{TagID: 2, Name: "Red"},{TagID: 3, Name: "Barker"}]}  

这是我的 Controller 中调用返回 Dog JSON 对象的服务的方法。

dogSvc.getDog($routeParams.dogId).then(
            function (response) {
               $scope.dog = response.data;
            },
           function (response) {
               $scope.status = response.status;
       });

我想将默认选定值设置为 Dog.Tags 值。

然后我有一个类似的服务，它返回所有可用的标签，我想将其填充为选择框中的选项。

tagSvc.getAllTags().then(
    function (response) {
        $scope.tagsAvailable = response.data;
    },
    function (response) {
        $scope.status = response.status;
    });

填充可用标签，但不填充默认值。如何根据返回的 Dog 对象的标签预先选择选项？

Answer 1

这就是我最终所做的

$q.all([tagSvc.getAllTags(), dogSvc.getDog($routeParams.dogId)]).then(
    function (responses) {
        $scope.tagsAvailable = responses[0].data;
        $scope.dog = responses[1].data;
        $scope.dog.Tags = $scope.tagsAvailable.filter(
                 function (tag) {
                     return $scope.dog.Tags.some(
                         function (elem) {
                             if (elem.TagID == tag.TagID) return true;
                         });
                 });

    });

基本上是这样的:

1. 检索可用标签。
2. 检索现有标签，这些标签将成为默认标签。
3. 获取可用标签并对其进行过滤，以便仅包含现有标签数组中存在的可用标签。
4. 将过滤后的可用标签设置为模型的标签值。