0

リソースを呼び出して、結果を変数に入れるAngularコントローラーがあります。

次に、HTML で、その変数のオブジェクトを調べて、ng-repeat を使用していくつかの HTML 要素をレンダリングしています。

私が抱えている問題は、レンダリングされる HTML 要素ごとに、id で要素を取得する関数を呼び出す必要があることです。

この JS 関数を呼び出した時点では、要素はまだレンダリングされていません。

これはコントローラーコードです。

cmsUserResource.GetOpCoUsersViewModel($routeParams.id.split("-")[1]).then(
  function (response) {

    vm.response = response;

    //This works because the HTML for this element is not generated dynamically
    Sortable.create(document.getElementById('advanced-1'), {
      sort: true,
      group: sortableOptions,
      animation: 200,
      onStart: function () {
        angular.element(document.getElementById('opCoUsersForm')).scope().opCoUsersForm.$dirty = true;
      }

    });


    vm.response.brands.forEach(function (brand) {
      //This DOES NOT work, the elements are not on the page yet.

      Sortable.create(document.getElementById('brand-' + brand.id), {
        sort: true,
        group: sortableOptions,
        animation: 200,
        onStart: function () {
          angular.element(document.getElementById('opCoUsersForm')).scope().opCoUsersForm.$dirty = true;
        }

      });
    });
  });

これはHTMLコードです

<div class="block__list">
  <div>
    <div class="formDefinitionPositionTitle">CMS Users in {{vm.response.opCo.companyName}} </div>
    <ul id="advanced-1" class="block__list_tags handle">
      <li umbracoUserId="{{cmsUser.cmsUserId}}" ng-repeat="cmsUser in vm.response.cmsUsers">{{cmsUser.cmsUserName}}</li>
    </ul>
  </div>
</div>

<h3>Users In Brands</h3>
<div ng-repeat="brand in vm.response.brands">
  <div class="block__list">
    <div>
      <div class="formDefinitionPositionTitle">CMS Users in {{brand.brandName}} </div>
      <ul id="brand-{{brand.id}}" class="block__list_tags handle">
        <li umbracoUserId="{{cmsUser.cmsUserId}}" ng-repeat="cmsUser in brand.cmsUsers">{{cmsUser.cmsUserName}}</li>
      </ul>
    </div>
  </div>
  <br /><br />
</div>

では、angular を呼び出す前に HTML を待機させるにはどうすればよいですか。

Sortable.create(document.getElementById('brand-' + brand.id),
4

1 に答える 1