2

私はコントローラを持っていAppCtrlます

scope.transaction = {}

インデックスは次のようになります

  <div class="control-group">
    <label class="control-label">Date</label>

    <div class="controls">
      <div class="control-group input-append date form_datetime">
        <date-time-picker data-ng-model="transaction.date"></date-time-picker>
      </div>
    </div>
  </div>
  <div class="control-group">
    <label class="control-label">Amount</label>

    <div class="controls">
      <div class="input-append">
        <input type="text" name="transactionAmount" ng-model="transaction.amount" required>
      </div>

私のカスタムディレクティブは次のようになります

angular.module('customDirectives', []).directive('dateTimePicker', function() {
      return {
        restrict: 'E',
        replace: true,
        scope: {
          transaction['date']: '=' # COMPILATION ERROR HERE
        },
        template: '<div class="control-group input-append date form_datetime">'+
          '<input type="text"  readonly data-date-format="yyyy-mm-dd hh:ii" name="transactionDate" ng-model="transaction.date" data-date-time required>'+
          '<span class="add-on"><em class="icon-remove"></em></span>'+
          '<span class="add-on"><em class="icon-th"></em></span>'+
          '</div>',
        link: function(scope, element, attrs, ngModel) {
          var input = element.find('input');

          element.datetimepicker({
            format: "yyyy-mm-ddThh:ii:ssZ",
            showMeridian: true,
            autoclose: true,
            todayBtn: true,
            pickerPosition: 'bottom-left'
          });

          element.bind('blur keyup change', function(){
            console.log('binding element');
            scope.$apply(date);
          });

          function date() {
            console.log('setting date',input.val());
            scope.ngModel = input.val();
          }

          date(); // initialize
        }
      }
  });

ディレクティブから日付値を割り当てたいのですが$scope.transaction.date、コンパイル エラーとして失敗します。どうすればこれを達成できますか?

4

1 に答える 1

6 
scope: {
      transaction['date']: '=' # COMPILATION ERROR HERE
    },

する必要があります

scope: {
      transactionDate: '='
    },

と

<date-time-picker data-ng-model="transaction.date"></date-time-picker>

する必要があります

<date-time-picker transaction-date="transaction.date"></date-time-picker>

次に、ディレクティブ内で scope.transactionDate = myValue; を呼び出すことができます。

scope.$apply(); 内

編集: ディレクティブ内で ng-model を使用する場合は、使用できます 

....
restrict: 'E',
require: '?ngModel',
....

と

controller.$setViewValue(value); //this will in directive code where you want set the value of the ng-model bound variable.

Htmlで

 <date-time-picker data-ng-model="transaction.date"></date-time-picker>
于 2013-05-13T20:45:45.367 に答える