Question

我遇到使用AngularJS生成动态标签（jquery-ui）的问题。

我已经创建了一个指令，用于在具有ul＆gt;的div标签上调用Tabs（jQuery-UI）初始化。李＆GT;使用ng-repeat生成元素。

我认为问题是在选项卡初始化的某个地方没有与模型绑定同步，我在选项卡上得到一个奇怪的行为。我认为可能会发生这种情况，因为在模型被“更改”之前标签的初始化是因为我用ajax加载模型，而且我不知道如何处理标签小部件的“重新初始化”。

我的指示看起来像这样：

myApp.directive('juiTabs', function () {
    return function postLink(scope, iElement, iAttrs) {
        jQuery(function () {
            $(iElement).tabs();
        });

    }
});

我的控制器

function MyCtrl($scope, $locale, $routeParams, $http) {

    $scope.DataSource = null;

    $http({
        url: "/api/product/1",
        method: "GET",
        data: { "foo": "bar" }
    }).success(function (data, status, headers, config) {

        if (data.isSucess) {
            $scope.DataSource = data.Data;
        }
        else {
            NotifyError("...");
        }
    ...

有没有人知道如何在模型更改后强制重新初始化标签？

Answer 1

尝试在指令中“观察”您的模型：

myApp.directive('juiTabs', function () {
    return function postLink(scope, iElement, iAttrs) {
        scope.$watch(iAttrs.ngModel, function (newValue) {
            jQuery(function () {
                $(iElement).tabs();
            });
        }
    }
});

jQueryUI Tabs + AngularJS的问题

1 个答案: