2013-03-15 2 views
0

그래서 사용자가 어떤 questionNumber에 있는지에 따라 동적으로 #panel div에로드되는 html이 있습니다. 이것은 모든 코드가 아니라 내가 생각하는 모든 관련 코드입니다. 어쨌든 <input> get이 페이지에로드되지만 실제로 아무 것도 수행하지 않습니다. 나는 무엇을 여기에서 놓치고 있냐? 당신이 DOM에 HTML을 추가하면 바인더 제본 변수 단지 등 {{variable}}동적으로로드 된 입력 상자에는 아무런 변화가 없습니다

var readingController = function (scope, Romanize){ 
     scope.usersRomanization; 
     //alert(scope.usersRomanization); 
} 

var app = angular.module('Tutorials', ['functions', 'tutorials']).controller('getAnswers', function ($scope, $element, Position, Romanize) { 
$scope.sectionNumber = Position.sectionNumber; 
if ($scope.sectionNumber === 0){ 
    $('#panel').html('<div ng-controller="readingController"><input ng-model="usersRomanization"></input></div>'); 
    readingController($scope, Romanize); 
} 

<body ng-controller="getAnswers"> 
    <div id="panel"> 
    </div> 
</body> 
+0

컨트롤러에 jQuery를 사용할 수 없습니다. [jQuery 배경이있는 경우 [AngularJS에서 어떻게 생각합니까?] (http://stackoverflow.com/questions/14994391/how-do-i-think-in-angularjs-if-i-have-a)를 참조하십시오. -jquery-background). – Stewie

+0

그런 다음 어떻게이 HTML을 questionNumber를 기반으로 페이지에로드해야합니까? 이것이 기술적으로 작동하지 않아야한다는 규칙에도 불구하고 사실에도 불구하고? – Tules

답변

1

로까지 보여 questionNumber의 === 1, 당신이 그것을 컴파일 $에 각도를 말할 때 저도 같은 문제가 있습니다. 이것은 지침에서 수행되어야합니다. 그런 다음 같은 것을 할 $compile를 주입해야합니다 :

var content = '<div ng-controller=...></div>'; 
var compiled = $compile(content)(scope); 
// then put the content where you want 

또는 더 나은, 지시어를 정의하고 자동 각도에 의해 당신을 위해 컴파일 얻을 것이다 template를 사용합니다.

다른 대안으로는 ng-include (로드 된 내용을 컴파일합니다)와 ng-switch가 있습니다. 그러면 템플릿을 HTML에 넣을 수 있습니다.

+0

그런 다음 questionNumber를 기반으로 지시문을 동적으로로드하려면 어떻게해야합니까? – Tules

+0

ng-include 또는 ng-switch를 시도하십시오. 얼마나 많은 질문이 있는지, 또는 템플릿이 어디에서오고 있는지 알지 못하면 말하기 어렵습니다. 템플릿이 별도의 파일에 있거나 스크립트 (http://docs.angularjs.org/api/ng)를 사용할 수 있습니까? 지시어 : 스크립트]를 자바 스크립트에 넣으시겠습니까? 그렇다면 ng-include를 사용하십시오. ng-switch를 사용하면 모든 템플릿을 HTML에 넣을 수 있습니다. –

+0

미안하지만, sectionNumber를 기반으로 말했어야만합니다. 현재 2 섹션 만 있지만 앞으로는 더 많이있을 것입니다. – Tules

관련 문제