1

orderByフィルターが $complie 要素で機能しない理由がわかりません。

その後、実行時に要素を変更しています $compile サービスを使用して、Angular ディレクティブを適切に動作させるために変更された要素を手動でコンパイルしていますが、$compile サービスを適用した後にフィルターによる注文が正しく機能していないことに気付きました。

 <table class="gridTable" id="serviceContractTable" flexicolumns="srcCustomer.ServiceContracts:500"  pagesize="10">
  <thead>
    <tr class="tableRow">
      <th sorting="ContractRefNo">Contract Ref No</th>
      <th class="rightAlign" sorting="PaymentInterval">Payment Interval</th>

      <th class="centreAlign">
        <a class="src-plus-2" style="text-transform: none;" ng-click="loadSvcContract()">&nbsp;ADD</a>
      </th>
    </tr>
  </thead>
  <tbody id="serviceContractBody">
    <tr ng-hide="contract.Deleted" ng-repeat="contract in srcCustomer.ServiceContracts | orderBy:serviceContractTable:reverseserviceContractTable" class="tableRow" ng-click="loadSvcContract(contract)">
      <td>{{contract.ContractRefNo}}</td>
      <td class="rightAlign">{{contract.PaymentInterval}}</td>
      <td class="centreAlign"><span dateformat ng-model="contract.StartDate"></span></td>

    </tr>
  </tbody>
</table>

これは、flexicolumns としてディレクティブを適用し、$compile を使用する 1 つのサービスを注入したテーブル要素です。

//指令

myApp.directive('flexicolumns', ['$http','InfiniteScroll', 'FlexiColumns', function (http, infiniteScroll, flexiColumns) {
    return {
        restrict: "A",
        link: function (scope, element, attrs) {

            scope.$watch(scopeElement, function (newValue, oldValue) {
                scope.isTableLoaded = false;
                if (newValue != undefined) {
                    if (newValue.length > 0) {
                       flexiColumns.FlexiColumn(element,scope, {
                                    height: tblHeight
                       });

//サービス

    myApp.factory('FlexiColumns', function ($compile) {

return {

        FlexiColumn: function (element,scope, agr) {
           // all the code here to modified element 
          // here i am cloning the element
          var newElement = element.clone(true, true);
          $compile($(newElement ).html())(scope); 

    };
    }

$compile サービスでフィルターを使用する方法のどこが間違っているのか教えてください。

4

1 に答える 1

1

問題は、リンカー関数によって返される要素を使用していないことです。$compile の API は次のように機能します。

var newScope = $scope.$new()
newScope.whatever = Math.random();
var linker = $compile("<div>{{5 + 5}} - {{whatever}}</div>");
var element = linker(newScope);

そこで、FlexiColumn にリンカーから返された JQLite/JQuery オブジェクトを返させ、その要素を DOM に配置します。すでに DOM にあるものをコンパイルしてリンクするだけでは機能しません。リンクされた要素を自分で DOM に配置する必要があります。

于 2013-08-05T12:01:37.373 に答える