Ajax işlevselliğine sahip Açısal-UI Seçmeli 2 ile iki yönlü Veri Bağlama

Question

Ajax işlevselliği ile AngularJS + Açısal-UI Seçme2 ile iki yönlü Veri Bağlama.

Genel yoldan Select2 açılır Ajax davranışını uygulamak için bir yönerge oluşturdum: - (FormatResult, biçimlendirme için biçimlendirme yöntemleri ve URL'yi almak için birkaç öznitelik gerektirir).

Sorunum, "Düzenleme Modu" nda değeri nasıl yükleyeceğiniz, biçimlendirme yönteminde açılır menüden seçilen değer alınır, ancak ekranı yüklerken, açılır menüyü, ciltlendiği aynı değerden yüklemek istiyorum. Örnek: -

<input type="hidden" for="part" class="bigdrop" style="width: 250px" formatresult="partFormatResult" formatselection="partFormatSelection" aurl="/api/Part" search-drop-down ui-select2="configPartSelect2" ng-model="product.SalesPart" data-placeholder="Select Part" ng-change="onPartSelect();" /> 

    Directive Code 

    One23SRCApp.directive('searchDropDown', ['$http', function (http) { 
     return function (scope, elm, attrs) { 
      var raw = elm[0]; 
      var fetchFuncName = "fetch" + attrs["uiSelect2"]; 
      console.log("Directive load pat " + scope[attrs["ngModel"]]); 
      scope[fetchFuncName] = function (queryParams) { 
       var result = http.get(queryParams.url, queryParams.data).success(queryParams.success); 
       result.abort = function() { 
        return null; 
       }; 
       return result; 
      }; 


      scope[attrs["uiSelect2"]] = { 
       minimumInputLength: 3, 
       initSelection: scope[attrs["initselection"]], 
       ajax: { 
        url: attrs["aurl"], 
        data: function (term, page) { 
          return { params: { isStockable: true, query: term, pageNo: page, pageSize: 20 } }; 
        }, 
        dataType: 'json', 
        quietMillis: 100, 
        transport: scope[fetchFuncName], 
        results: function (data, page) { 
         var more = (page * 20) <= data.length; // whether or not there are more results available 
         return { results: data, more: more }; 
        } 
       }, 
       formatResult: scope[attrs["formatresult"]], 
       formatSelection: scope[attrs["formatselection"]], 
       dropdownCssClass: "bigdrop" // apply css that makes the dropdown taller 
      }; 

      return { bind: attrs["ngModel"] }; 
     }; 

    }]); 

//inside controller- 
after loading of data 
    $("#partDD").select2("val", product.SalesPart); 
//$scope.partInitSelection definition. 
    $scope.partInitSelection = function (element, callback) { 
     if (! $scope.PartList) { 
      $scope.PartList = [$scope.product.SalesPart]; 
     } else { 
      $scope.PartList.push($scope.product.SalesPart); 
     } 
     callback($scope.product.SalesPart); 
    }; 

} 

Answer 1

nihayet Sabit: - i kapsamındaki konfigürasyon nesnesini tutulması gibi [attrs [ "uiSelect2"]], Yukarıdaki konfigürasyon nesnesinin .ajax.data Yöntem I yüklerken her zaman adı veri. Belki bir plunker http://plnkr.co/ kurmanız gerekir.

scope[attrs["uiSelect2"]].ajax.results(product.SalesPart.text, 1);