سؤال

أحاول إدخال عرض متداخل في طريقة العرض العادية باستخدام جهاز التوجيه ui.أعلم أن ذلك ممكن عن طريق القيام بـ ng-include.لكني أريد حلها باستخدام ui-router.

HTML الخاص بي هو كما يلي:

<div class="row">
        <div class="col-md-12">
            <div class="panel panel-default">
                <div class="panel-heading">Project todos</div>
                <div class="panel-body">
                    <div ui-view="todos"></div>
                </div>
            </div>
        </div>
    </div>

ثم في النص الخاص بي حصلت على حالة:

.state('project', {
   url: '/project/:projectId',
   templateUrl: 'views/project/project.html',
   controller: 'ProjectCtrl',
   views: {
      'todos': {
       templateUrl: 'views/project/todos.html'
      }
   }
})

تحديث - أليس هناك شيء من هذا القبيل ممكن؟

.state('project', {
   url: '/project/:projectId',
   templateUrl: 'views/project/project.html',
   controller: 'ProjectCtrl',
   views: {
      'todos@project': {
         templateUrl: 'views/project/todos.html'
      }
   }
})

يمكن لأي شخص العثور على خطأ مطبعي أو شيء من هذا؟لقد قرأت المستندات.لست متأكدا ما هو الخطأ.

شكرا لك مقدما!

هل كانت مفيدة؟

المحلول

هناك عمل الغطاس, ، موضحًا كيف يمكننا تشغيله

في ملف Index.htm نحتاج إلى الحصول على ملف <div ui-view="" ></div>, وهو المكان الذي أدخلنا فيه project.html.ثم نقوم بتعديل تعريف الحالة، لإدخال عرض متداخل أيضًا - باستخدام ui-view التسمية المطلقة:

  .state('project', {
    url: '/project/:projectId',

    views: {
      '' : {
        templateUrl: 'views.project.project.html',
        controller: 'ProjectCtrl',
      },
      'todos@project': {
        templateUrl: 'views.project.todos.html'
      }
    }
  });

الاسم المطلق todos@project, ، سوف يقوم بإدخال todos.html في project.html.افحص ال الغطاس

انظر:

اقتباس:

...خلف الكواليس، يتم تعيين اسم مطلق لكل عرض يتبع مخططًا viewname@statename, ، حيث viewname هو الاسم المستخدم في توجيه العرض واسم الحالة هو الاسم المطلق للحالة، على سبيل المثال.contact.item.يمكنك أيضًا اختيار كتابة أسماء طرق العرض الخاصة بك في الصيغة المطلقة...

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top