2

Angular の $http ディレクティブを使用してサーバーからタグのリストを取得し、それを使用して select2 選択を設定しようとしています。私のコードは次のようになります。

    var samplePage = angular.module('samplePage', ['ui.select2']);

    samplePage.controller('sampleController', function($scope, $http) {
        console.log($scope);
        // THIS WORKS
        $scope.tags = ['a', 'b', 'c'];
        $http.get('angular.html').success(function(rc) {
            console.log($scope);
            // THIS DOES NOT WORK
            $scope.tags = ['d', 'e', 'f'];
        })
    });

    angular.bootstrap(document, ['samplePage']);

ただし、「タグ」は更新されていません。または、「タグ」は更新されていますが、select2 ウィジェットが適切にバインドされていないようです。

ビューは次のようになります。

<div ng-app="samplePage">
    <div ng-controller="sampleController">
    <input id="tags" ui-select2="{tags:tags, simple_tags: true}" multiple ng-model="myTags" style="width: 150px;">
    <p>$scope.tags = {{tags}}<p>
    </div>
</div>

完全なテスト アプリケーションの要点は次のとおりです: https://gist.github.com/poundifdef/6544542

select2 モジュールを不適切に使用していますか? それとも、モジュール自体にバグがありますか?

4

1 に答える 1

1

ng-modelディレクティブは、選択入力を設定するものである必要があります$scopeng-model="tags"代わりに使用してください。

EDIT あなたが持っているとき

<input id="tags" ui-select2="{tags:tags, simple_tags: true}" multiple ng-model="myTags" style="width: 150px;">

はドロップダウンにオプションとして表示するモデルをtags指し、 は選択されたオプションを指します。ui-select2="{tags:tags, simple_tags: true}"myTagsng-model="myTags"

いくつかのオプションを選択してリストをロードする場合は、コントローラーでそれらを として設定します$scope.myTags。これは通常、オプションのサブセット (つまり、$scope.tagsここ) である必要があります。

于 2013-09-13T23:36:39.403 に答える