AngularJS 表达式 $scope 未在模板 html 中进行评估答案

【问题标题】：AngularJS expression $scope is not being evaluated in the template htmlAngularJS 表达式 $scope 未在模板 html 中进行评估
【发布时间】：2019-07-18 13:40:47
【问题描述】：

我能够正确地 console.log 所有值，但表达式 img ng-src="{{$scope.bus}}" 没有被评估。我对 angularJs 很陌生，任何帮助都会很棒。下面是代码

$scope.showAdvanced = function (ev, bus) {

      $scope.bus = bus;
      console.log(bus);
      console.log("scope.bus ="+$scope.bus);
      $mdDialog.show({
        controller: DialogController,
        template: '<div role="dialog" aria-label="Eat me!" layout="column" layout-align="center center">' +
          '    <md-toolbar>' +
          '      <div class="md-toolbar-tools">' +
          '        <h2>Surprise!</h2>' +
          '      </div>' +
          '    </md-toolbar>' +
          '  ' +
          '   <div ' +
          '    <div id="slideDiv" class="demo-dialog-content">' +
          '      <div layout="row" >' +
          '        <img ng-src="{{$scope.bus}}">' +
          '      </div>' +
          '    </div>' +
          '  ' +
          '    <div layout="row" class="demo-dialog-button">' +
          '      <md-button md-autofocus flex class="md-primary" ng-click="cancel()">' +
          '        Close' +
          '      </md-button>' +
          '    </div>' +
          '  </div>',
        parent: angular.element(document.body),
        targetEvent: ev,
        clickOutsideToClose: true,
        fullscreen: $scope.customFullscreen // Only for -xs, -sm breakpoints.
      })
    };

【问题讨论】：

你试过<img ng-src="{{bus}}">吗？
是的，我有。它也不起作用

标签： html angularjs angularjs-scope

【解决方案1】：

$scope 在这种情况下不起作用，因为它是一个孤立的。您可以尝试添加 locals。谢谢。

locals: {bus: $scope.bus}

或

按照第一种方法。

locals: {parent: $scope}

【讨论】：

isolateScope: false 那你可以试试这个吗？
不计算 {{}} 内的任何表达式。我似乎不明白为什么

【解决方案2】：

$scope.showAdvanced = function (ev, bus) {

      $scope.bus = bus;
      console.log(bus);
      console.log("scope.bus ="+$scope.bus);
      $mdDialog.show({
        controller: DialogController,
        controllerAs: 'DialogCtrl',
        template: '<div role="dialog" aria-label="Eat me!" layout="column" layout-align="center center">' +
          '    <md-toolbar>' +
          '      <div class="md-toolbar-tools">' +
          '        <h2>Surprise!</h2>' +
          '      </div>' +
          '    </md-toolbar>' +
          '  ' +
          '   <div ' +
          '    <div id="slideDiv" class="demo-dialog-content">' +
          '      <div layout="row" >' +
          '        <img ng-src="{{DialogCtrl.bus}}">' +
          '      </div>' +
          '    </div>' +
          '  ' +
          '    <div layout="row" class="demo-dialog-button">' +
          '      <md-button md-autofocus flex class="md-primary" ng-click="cancel()">' +
          '        Close' +
          '      </md-button>' +
          '    </div>' +
          '  </div>',
        parent: angular.element(document.body),
        targetEvent: ev,
        clickOutsideToClose: true,
        fullscreen: $scope.customFullscreen // Only for -xs, -sm breakpoints.
      })
    };

【讨论】：