0

私がやろうとしているのは、仲間リストの仲間をクリックした後、Facebook でチャットするのと同じように、現在の DOM の他の要素を邪魔することなく、チャット ダイアログ テンプレート HTML ファイルをロードすることです。

私の問題は、html テンプレート ファイルをロードした後、{{contact.jid}} などのスコープ変数が適切にレンダリングされず、ダイアログのコントローラーが呼び出されないことです。

これらの変数が適切にレンダリングされるように、コントローラーで再レンダリングまたは呼び出しを強制するにはどうすればよいですか? または、これを行うために jQuery.load 関数を使用しないでください。私は他の方法を理解することはできません。

ありがとうございました。

コントローラーのコード:

// Controller for the chat dialog
ctrl.controller('ChatCtrl',function($scope){
    $scope.test = "Test"
});

// Controller for the buddy list
// $scope.toggleDialog is called when a buddy is clicked
ctrl.controller('ContactCtrl',function($scope){
    $scope.contacts = window.contactList;
    $scope.toggleDialog = function(to){
        $.("#chatarea").load("chatdialog.html")
    };
});

ng-controller の属性を持つ chatdialog.html をロードした後、チャット ダイアログのコントローラー関数が呼び出されないため、{{test}} 変数が設定されません。

4

3 に答える 3

0

I suppose the:

$.("#chatarea").load("chatdialog.html")

is the jQuery .load, or something similar. I would get the template via ngInclude, checking if test is setted or not; html:

<div id="chatarea" ng-if="test">
  <div ng-include="'chatdialog.html'"/>
</div>

controller:

ctrl.controller('ContactCtrl',function($scope){
    $scope.contacts = window.contactList;
    $scope.test = '';
    var callbackFunction = function(data) {
      $scope.test = data.test;
    };
    $scope.toggleDialog = function(to){
      AjaxRequestToGetBuddyInfoAndMessages(to, callbackFunction);
    };
});

Obviously test will be a more complex object, so the ngIf test will be different (and you will need to take into account the fact that:

$scope.test = data.test

if they are objects, they will lose the reference and have an unwanted behaviour).

于 2014-04-07T17:32:10.953 に答える