0

これはhtmlページです 

<form name="createPromoterFormName">
            <div class="col s12" ng-repeat="customer in model.customers" ng-if="model.selectedCustomerSubtab == $index">
            <div class="row inputcontainer">
                <div class="input-field col s4">
                    <input placeholder="First Name" type="text" ng-model="customer.customer_name" class="validate" ng-maxlength="50" ng-required="true" />
                    <label class="active labelName">Customer Name </label>
                </div>
                <div class="input-field col s4">
                    <input type="text" class="validate" ng-maxlength="50" ng-required="true" ng-model="customer.avg_monthly_sales" />
                    <label class="active labelName">Average Monthly Sales </label>
                </div>
                <div class="input-field col s4">
                    <select ng-model="customer.avg_payment_cycle_days" ng-options="i.value as i.value for i in model.avgPaymentCycleDays" ng-change="changeSelectedItem()">
   <option value="">Select Average Payment Cycle Days</option>
</select>
                    <label class="labelName">Avg Payment Cycle Days [[customer.avg_payment_cycle_days]]</label>
                </div>
            </div>
            <div class="row inputcontainer">
                <div class="input-field col s4">
                    <input type="text" class="validate" ng-maxlength="50" ng-model="customer.avg_paymmonths_in_business_with_customerent_cycle_days" />
                    <label class="active labelName">Months in business with customer</label>
                </div>
            </div>
        </div>
     </form>

Controller.js

$scope.model = {  
    customers: [{
        customer_name: "",
        avg_monthly_sales: "",
        avg_payment_cycle_days: "",
        months_in_business_with_customer: ""
    }, {
        customer_name: "",
        avg_monthly_sales: "",
        avg_payment_cycle_days: "",
        months_in_business_with_customer: ""
    }, {
        customer_name: "",
        avg_monthly_sales: "",
        avg_payment_cycle_days: "",
        months_in_business_with_customer: ""
    }],
    avgPaymentCycleDays : [{
        value: '15',
        id: '1'
    }, {
        value: '30',
        id: '2'
    }, {
        value: '45',
        id: '3'
    }, {
        value: '60',
        id: '4'
    }, {
        value: '75',
        id: '5'
    }, {
        value: '90',
        id: '6'
    }],
    selectedPromoterSubtab: 0,
    selectedCustomerSubtab: 0,
}


$scope.changeSelectedItem = function() {
    console.log($scope.model.customers);
}

ここに画像の説明を入力 マテリアルcssを使用しています。オプションを選択すると、ng-change がトリガーされず、データが ng-model にバインドされません。

どこで間違いを犯しているのか、誰か助けてもらえますか?

これはplnkrリンクです

4

2 に答える 2

1

問題は、スクリプト ファイルを含めた順序です。

プランカーを確認してください。

https://plnkr.co/edit/eFL48s3UyhwdTFzwTR05

ng-model は適切にバインドされており、ng-change も適切に起動されています。

<script data-require="jquery" data-semver="3.0.0" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.6/js/materialize.min.js"></script>
<script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.9/angular.js" data-semver="1.4.9"></script>
于 2016-06-16T13:59:09.877 に答える
0

まず ng-selected は必要ありません。ドロップダウンにその値がある場合、ng-model はドロップダウンから選択する必要があるものを自動的に検出します。

したがって、選択を次のように変更します

<select ng-model="customer.avg_payment_cycle_days" ng-options="i.value as i.value for i in model.avgPaymentCycleDays" ng-change="changeSelectedItem()">
   <option value="">Select Average Payment Cycle Days</option>
</select>

また、あなたのplnkrに従ってjqueryを含めてください。あなたはそれを含めていません

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.6/js/materialize.min.js"></script>
  <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.9/angular.js" data-semver="1.4.9"></script>
  <script src="app.js"></script>

ここに作業plnkrがあります

https://plnkr.co/edit/p7t7KcNmChZlT5Jg0pr2?p=preview

于 2016-06-16T12:02:43.463 に答える