传递给指令的变量在父级变为未定义？

Question

我有以下代码：

parent.jade：

    img {
        display: block;
        margin-left: auto;
        margin-right: auto
    }

parent.js：

<div class="row">
  <div class="col-sm-1">A</div>
  <div class="col-sm-12">
    <img src="https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcS2Xjhc-NPN5UAWzKdY3Kpl29Tyt-zCC8aOd3Gez8i2zrF3BS9bSQ" />
  </div>
  <div class="col-sm-1">B</div>
  <div class="col-sm-1">C</div>
  <div class="col-sm-1">D</div>
  <div class="col-sm-1">E</div>
  <div class="col-sm-1">F</div>
  <div class="col-sm-1">G</div>
  <div class="col-sm-1">H</div>
  <div class="col-sm-1">I</div>
  <div class="col-sm-1">J</div>
  <div class="col-sm-1">K</div>
  <div class="col-sm-1">L</div>
</div>

directive.js：

    img {
        display: block;
        margin-left: auto;
        margin-right: auto
    }
    .asset {
      margin-right: 50px;
      margin-left: 50px;
    }

directive.jade：

    <div class="row asset">
      <div class="">A</div>
      <div class="col-xs-12">
        <img src="https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcS2Xjhc-NPN5UAWzKdY3Kpl29Tyt-zCC8aOd3Gez8i2zrF3BS9bSQ" />
      </div>
      <div class="col-md-1 col-sm-1 col-lg-1">B</div>
      <div class="col-md-1 col-sm-1 col-lg-1">C</div>
      <div class="col-md-1 col-sm-1 col-lg-1">D</div>
      <div class="col-md-1 col-sm-1 col-lg-1">E</div>
      <div class="col-md-1 col-sm-1 col-lg-1">F</div>
      <div class="col-md-1 col-sm-1 col-lg-1">G</div>
      <div class="col-md-1 col-sm-1 col-lg-1">H</div>
      <div class="col-md-1 col-sm-1 col-lg-1">I</div>
      <div class="col-md-1 col-sm-1 col-lg-1">J</div>
      <div class="col-md-1 col-sm-1 col-lg-1">K</div>
      <div class="col-md-1 col-sm-1 col-lg-1">L</div>
    </div>

chat-box(message-content="messageContent" send-message="sendMessage()") div {{messageContent}} $scope.messageContent; $scope.sendMessage = function(){ alert($scope.messageContent); } 会app.directive('chatBox', ['$window', function ($window) { //--- return { restrict: 'E', scope: { messageContent: '=', sendMessage: '&?' }, templateUrl: '/tpl/chatbox', link: function(scope, element, attr){ } }; //--- }]); 始终提醒我，但如果我尝试在div(layout="row" layout-align="bottom bottom" style="padding: 10px; flex-shrink: 0;") textarea(ng-model="messageContent" flex) md-button(ng-click="sendMessage()") 使用undefined并在我的指令中调用该函数，它将返回给我正确的价值。

它还会在父级打印div的正确值。

有人有想法吗？

Answer 1

我设法通过在父控制器中将$scope.messageContent;更改为$scope.messageContent = {};来解决此问题。