كيفية إعادة تقديم قالب التوجيه ووظيفة الارتباط؟
-
21-12-2019 - |
سؤال
أقوم بإنشاء "شجرة" تنقل تسمح لك بشكل أساسي بالانتقال إلى طرق عرض الوالدين مثل ذلك
Home > Planner > Contacts > john.smith@hotmail.com
هذه القائمة هي مجرد طبيعية <ul>
يجب أن يتم تغييره في كل مرة يتم فيها تغيير العرض والسماح للمستخدم بالنقر فوق أي من الروابط المذكورة أعلاه للتنقل.انا استخدم ui-router
'س $stateChangeStart
حدث لإنشاء قائمة الروابط الخاصة بي، فالمشكلة هي أن التوجيه الخاص بي لا "يعيد إنشاء" هذه القائمة في كل مرة تتغير فيها الصفحة.
هل هناك طريقة لفرض إعادة التوجيه في كل مرة أقوم فيها بتغيير حالتي؟
توجيه TreeNav
app.directive('treeNav', ['$rootScope', function ($rootScope) {
return {
replace: true,
restrict: 'E',
template: '<ul>\
<li ng-repeat="item in treeNavs">\
<a ui-sref="{{ item.state }}">{{ item.name }}</a>\
<span> > </span>\
</li>\
</ul>',
link: function (scope, elem, attrs) {
scope.treeNavs = $rootScope.treeNav.reverse();
scope.$watch('$rootScope.treeNav', function (newVal, oldVal) {
scope.treeNavs = newVal.reverse();
});
}
}
}]);
المحلول
أعتقد أنك لا تقوم بإعداد الخاص بك $watch
البيان بشكل صحيح.
يجب عليك أيضًا توخي الحذر عند استخدامك .reverse
. reverse()
يعكس الإدخالات في صفيف في المكان, ، وهو على الأرجح ليس ما تريد القيام به، لأنه سيعدل المصفوفة الموجودة على $rootScope
.
يمكنك استخدام splice()
لإنشاء نسخة جديدة ثم عكس ذلك:
scope.treeNavs = $rootScope.treeNavs.splice().reverse();
$rootScope.$watch('treeNav', function(newVal) {
scope.treeNavs = newVal.splice().reverse();
});