在AngularJS中使用JqueryUI菜单

Using JqueryUI menu with AngularJS

本文关键字:JqueryUI 菜单 AngularJS      更新时间:2023-09-26

我们正在尝试让JqueryUI菜单在我们的AngularJS应用程序中工作。在Layout.js中,我们做了以下操作:

OURApp.controller('leftBarCtrl', ['$scope', function ($scope) {
    $scope.init = function () {
        $.ajax({
            url: "../Data/MainPageData",
            type: "GET",
            dataType: "Json",
            data: {},
            success: function (data) {
                if (data.Acknowledgment) {
                    $scope.$apply(function () {
                        $scope.subscriptionsModel = data.userSubscriptionsReponse.UserSubscriptionsObjects;
                        $scope.CompanyModel = data.userResponse.CompanyInformation;
                    })
                    $("#mdsubscriptionMenu").menu({
                        menus: "ul",
                        items: "li"
                    });
                }
               .......

但它似乎不起作用。我读到将menu()调用移动到一个angular"。指令"仅限于‘A’"应该能奏效。这是唯一推荐的让JqueryUI组件与AngularJS一起工作的方法吗?

谢谢

这类代码需要放在指令中。你不应该在控制器中使用jQuery

当你尝试在$apply()之外初始化插件时,你也没有考虑任何渲染时间。当你现在运行插件代码时,$("#mdsubscriptionMenu")可能仍然是空的。

这将有助于看到你用来呈现菜单的视图html。

您可以使用ng-repeat$last属性来触发菜单插件init