0

我的任務是創建一個表單並在點擊'提交'後將輸入的數據顯示在div上。該任務涉及創建兩個指令,一個用於創建表單,另一個用於顯示輸入的數據。應使用'服務'連接這兩個指令,以與兩個指令對應的兩個控制器進行通信。但是,我創建了兩個指令,但在腳本文件中,我遇到了一些問題。請幫忙。服務不能正常工作 - AngularJS

這裏是plunker鏈接:HERE

$scope.getFaster = function() { $scope.name = $scope.modelName; $scope.age = $scope.modelAge; $scope.place = $scope.modelPlace; $scope.gender = $scope.modelGender; };

有些事情不對的fasterBack.js文件

+0

你的做法是將wrong.angular控制器值在你的圓頂前$ scope.name綁定='XYZ 「;在您的html 中,您可以使用相同的範圍

{{name}}

回答

0

更新:

更新Plunker:http://plnkr.co/edit/bsFxDn3RQCGlmZLJMAil?p=preview

我已經它可以在沒有服務的情況下工作,這兩個例子都是重要的。他們只在提交按鈕上工作。

更新結束

與工作液更新plunker。我沒有使用過這個服務。但是,如果您想爲更復雜的目的使用服務,請告訴我,我會更新重新啓動的服務器。 然而,爲了澄清你,你必須使用兩個控制器和一個服務而不是指令。

我在這裏完成的工作只是將這兩個指令包裝在您創建的控制器中,並對指令進行了較小的修改(添加替換以移除顯示指令中的自定義元素和更改的模型名稱以使其相同作爲形式指令)。

的index.html

<div ng-controller="fasterCtrl"> 
    <faster-form></faster-form> 
    <faster-display></faster-display> 
</div> 

fasterDisplay.html

<div> 
    <div>Name : {{modelName}} </div><br> 
    <div>Age : {{modelAge}}</div><br> 
    <div>Place : {{modelPlace}}</div><br> 
    <div>Gender : {{modelGender}}</div><br> 
</div> 

http://plnkr.co/edit/y3jpxLis9PENGrRvW4Od?p=preview

+0

欣賞努力。但是,我試圖得到的不僅僅是使用ng-model更新顯示,而是我希望僅在按下提交按鈕後才能顯示詳細信息。猜你明白我的問題。 – Anand

+0

使用和不使用服務進行更新,他們都在工作並僅在提交時顯示數據。 http://plnkr.co/edit/bsFxDn3RQCGlmZLJMAil?p=preview – TheRodeo