AngularJS：不同視圖和不同控制器的數據

讓我們假設我想做一個測驗頁面。我有不同的問題類型。即任務是找到正確的順序，選擇一個答案，選擇多個答案，或用預定義的單詞填充一些空格等等。所以，我的數據上下文中有5個問題。其中2個是多項選擇題，1個是正確的順序問題，另外2個是貼片。主要觀點是：我不知道當前測驗中有多少種不同的問題類型。他們都需要一個自己的視圖，一個自己的控制器和一個自己的數據模型，因爲沒有統一的數據模型可以同時應用於clozen和正確的問題（如果我錯了，請糾正我）。AngularJS：不同視圖和不同控制器的數據

AngularJS和MVC模式的最佳方法是什麼？這是否適用？這是否與一般的MVC模式相矛盾？

來源

2016-02-08 Christopher300

我想Moodle（LMS）做了類似於您的要求，它可以處理不同類型的問題/問題類型。看看它。 – CodeTweetie

我們這樣做的方式是從數據開始。我們大多數的部分只有一種類型的問題，但有幾種可以有兩種或更多類型的問題。每個問題類型都有一個factory，它可以接受以XML開頭的JSON，並通過轉換過程運行，並添加每個問題所需的所有「掛鉤」。我們有一個叫做"questionBuilder"的東西，它會查看每個部分的questionType屬性，並在$injector中查找questionType + 'Factory'。

編輯：您可以像從亞馬遜訂購東西時那樣想到建造者。亞馬遜不知道如何製作咖啡壺或一罐網球。它所擁有的是一個很長的供應商清單，做知道如何做這些事情。所以，當你從亞馬遜訂購時，它會出現在供應這些東西的工廠清單中，拉出可以製作咖啡壺的那個工廠，並要求工廠提供咖啡壺。然後將它粘在一個盒子裏並運送給你。

角度就像UPS。它不知道或不在意盒子裏的東西。當你看到視圖時，你可以拿出那些你現在關心的問題。你的觀點了解問題類型（就像你知道如何使用那個咖啡壺，或者你可以找到）。

方便的是，Angular也與供應商列表（或$注入器）類似。 $注入器知道的任何東西，你都可以在你的構建器中找到，這就是你可以擁有任何你需要的工廠，而不必用一堆邏輯來混淆代碼，以便對特定工廠的依賴關係進行硬編碼。您正在查找與數據中指定的問題類型相匹配的工廠的$注入器。

如果在該部分中有多個問題類型，我們會放下questionType的「composite」。 compositeFactory查看每個問題的屬性，以確定在工廠中尋找$injector的位置。它還會查看部分中的信息，告訴它爲每個問題添加一個屬性，該屬性將進一步向下查看部分在ng-include中使用的視圖。

每個問題類型都有自己的特徵目錄，其中包含一個模塊，該模塊說明哪些路線匹配與該特徵一起使用哪些視圖（我們的一些問題類型根據客戶需求具有不同的變體）。複合功能具有單一視圖，基本上只是拉入工廠之前添加的ng-include部分。部分可能直接來自特性目錄之一，也可能是某個功能指令的包裝，這取決於我們需要的以及它最初的構建方式。

來源

2016-02-08 21:59:22

我並不完全瞭解Builder是什麼，以及Angular是如何應用的。 – Christopher300

Angular本身並不包含業務邏輯層，因此您必須添加它。 Angular沒有什麼能阻止你這樣做。我們在登錄用戶後執行此操作，以便知道要加載哪個評估。基本上，我們通過第一遍讀取XML文件並構建一個「assessmentMaster」來負責跟蹤整體評估中的位置。它構建但不填充每個部分的數據對象，其信息例如本部分的xml在哪裏。在導航到每個部分之前，我們調用section.load（），它加載並構建問題。 –

你不必這樣做，我們的邏輯可能與你所需要的不一致 - 我只是簡要介紹一下我們如何在自己的事情上做自己的事情。角。 –

所以你有5個問題，我會在你想要的每個視圖上做ng-repeat和ng-switch。

<div ng-repeat="question in questions" ng-switch="question.questionType"> 
    <div ng-switch-when="MultipleChoice" ng-controller="MultipleChoiceCtrl"> 
    ... multiple choice 
    </div> 
    <div ng-switch-when="RightOrder" ng-controller="RightOrderCtrl"> 
    ... right order 
    </div> 
</div>

來源

2016-02-08 22:57:44

AngularJS：不同視圖和不同控制器的數據

回答

相關問題