Angularjs表达式未显示在ngDialog模板中

时间:2015-03-02 04:33:41

标签: javascript angularjs ng-repeat ng-dialog

除了使用ngDialog库之外,我还使用ng-repeat来填充Firebase中的用户对象。我的目标是,当您点击时,请说出一个'视图'按钮,弹出一个小对话框,您可以在其中查看用户的详细信息。但是,我试图按照ngDialog的文档进行操作,而我的弹出模板并没有呈现任何表达式。

数据模型:

{
"members": {
"-JWT5y43YFy1mGirVVS2": {
  "date": 1410328158691,
  "firstname": "Michael",
  "image": "http://telehealth.org/wp-content/images/user-placeholder.jpg",
  "upcoming": "PTO on Thursday",
  "status": {
    "color":  "red",
    "contact": {
      "email": "test@email.com",
      "yahoo": "yahooIM"
    },
    "projects": {
      "projectone": "project one",
      "projecttwo": "project two",
      "projectthree": "project three",
      "projectfour": "project four",
      "projectfive": "project five",
      "projectsix": "project six",
      "projectseven": "project seven",
      "projecteight": "project eight",
      "projectnine": "project nine",
      "projectten": "project ten"
    }
  }
},
"-JWT65QvjwD4TSFjDx4V": {
  "date": 1410328192928,
  "firstname": "Magic",
  "image": "http://telehealth.org/wp-content/images/user-placeholder.jpg",
  "upcoming": "PTO on Thursday",
  "status": {
    "color":  "yellow",
    "contact": {
      "email": "test@email.com",
      "yahoo": "yahooIM"
    },
    "projects": {
      "projectone": "project one",
      "projecttwo": "project two",
      "projectthree": "project three",
      "projectfour": "project four",
      "projectfive": "project five",
      "projectsix": "project six",
      "projectseven": "project seven",
      "projecteight": "project eight",
      "projectnine": "project nine",
      "projectten": "project ten"
    }
  }
}

HTML:

<ul class="cbp-rfgrid" ng-repeat="member in members">
  <li class="{{member.status.color}}">
    <div class="dripicon profilephoto">&#xe084;</div>
    <div>
        <h3>{{member.firstname}}</h3>
        <div class="dripicon actions" 
            ng-click="viewStatus()">&#xe077;</div>

        <div class="dripicon actions" 
            ng-click="editStatus()">&#xe036;</div>
    </div>
  </li>
</ul>

控制器:

myApp.controller('MembersController', function($scope, $firebase, $location, ngDialog){

var ref = new Firebase('https://scrumcheck.firebaseio.com/members');
var members = $firebase(ref);

$scope.members = members.$asObject();

  $scope.viewStatus = function(){
    ngDialog.open({ template: 'views/popupTmpl.html' });
  }

  $scope.editStatus = function(){
    //not entered yet
  }

});

popupTmpl.html

<p>External modal template with external scope: <code>{{member.firstname}}</code></p>

当我点击&#39;视图&#39;按钮,触发viewStatus()函数,我没有为{{member.firstname}}获取任何内容 - 任何人根据您所看到的内容有任何建议吗?

再次感谢!

1 个答案:

答案 0 :(得分:0)

在弹出式窗口Tmpl.html中,你必须写成ng-repeat =“成员中的成员”然后写{{member.first name}}