Angularjs 角度材质中的md对话框不接受隔离范围_Angularjs_Dialog_Angular Material_Isolate Scope

Angularjs 角度材质中的md对话框不接受隔离范围

angularjs angular-material

Angularjs 角度材质中的md对话框不接受隔离范围,angularjs,dialog,angular-material,isolate-scope,Angularjs,Dialog,Angular Material,Isolate Scope,我正在使用Angular Material对话框根据数据内容生成弹出窗口。我正在使用ng repeat创建按钮，在其上单击将生成对话框但我无法将单个对象作为作用域注入控制器。这里是链接到代码文件如下所示： app.js var app = angular.module('myApp', ['ngMaterial']); app.controller('mainCtrl', function($scope,$mdDialog) { $scope.siteData = [{

我正在使用Angular Material对话框根据数据内容生成弹出窗口。我正在使用ng repeat创建按钮，在其上单击将生成对话框但我无法将单个对象作为作用域注入控制器。这里是链接到

代码文件如下所示：

app.js

    var app = angular.module('myApp', ['ngMaterial']);
app.controller('mainCtrl', function($scope,$mdDialog) { 
  $scope.siteData = [{
    Name: 'Google',
    URL: 'https://www.google.com'
  }, {
    Name: 'Yahoo',
    URL: 'https://www.yahoo.com'
  }, {
    Name: 'Rediff',
    URL: 'https://www.rediff.com'
  }];
$scope.showDialog = function(ev,scopeObj) {
            $mdDialog.show({
          //template: 'myModal',
          template:  '<md-dialog>' +
                    '  <md-dialog-content>' +
                    ' {{URL}}    ' +
                    '  </md-dialog-content>' +
                    '</md-dialog>',
          scope:scopeObj,
          targetEvent: ev,
          clickOutsideToClose :true,
          preserveScope :true,
          clickOutsideToClose:true,
        });
      };
});

var-app=angular.module（'myApp'，['ngMaterial']）；
app.controller（'mainCtrl'，函数（$scope，$mdDialog）{
$scope.siteData=[{
名称：'谷歌'，
网址：'https://www.google.com'
}, {
名称:"雅虎",，
网址：'https://www.yahoo.com'
}, {
名称：'Rediff'，
网址：'https://www.rediff.com'
}];
$scope.showDialog=函数（ev、scopeObj）{
$mdDialog.show({
//模板：“myModal”，
模板：“”+
'  ' +
“{{URL}}”+
'  ' +
'',
范围：scopeObj，
目标事件：ev，
单击外部以关闭：true，
范围:对,，
单击外部以关闭：true，
});
};
});

index.html

<html lang="en" ng-app="myApp">
<head>
  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=RobotoDraft:300,400,500,700,400italic">
  <link rel="stylesheet" href="style.css">
  <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/angular-material/0.10.0/angular-material.css">
  <meta name="viewport" content="initial-scale=1" />
</head>
<body  ng-controller="mainCtrl">
  <div ng-repeat="site in siteData">
 <md-button class="md-raised md-primary" ng-click = "showDialog($event,site)">{{site.Name}}</md-button>
  </div>
  <!-- Angular Material Dependencies -->
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-aria.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-material/0.10.0/angular-material.js"></script>
  <script src="app.js"></script>
</body>
</html>


{{site.Name}

请建议进行任何更改以实现此目的。

范围必须是“真实”范围，而不仅仅是数据对象

您应该使用控制器来传递数据

controller: function($scope){ $scope.URL=scopeObj.URL; },

在文档中有一个locals参数，它似乎是一个替代参数，但我不知道如何/在何处注入值

locals: scopeObj

下面是指向“已修改”的链接，该链接按预期工作。基本上，在控制器中注入“局部变量”

locals:{URL: scopeObj.URL},
controller: function($scope, URL){$scope.URL = URL;},

在控制器中，将注入的值放入本地$scope