AngularJS前端，directive的template的点击事件 绑定

HTML部分

<div class="panel-con">
	<!--动态生成分配规则参数录入表单控件-->
	<distribution rule="distributionRules" old-rule="oldDistribution" params="params" old-flag="distributionProjectId" model="model"
				  sub-param="subParam" date-sub-param="dateSubParam" on-rule-change="distributionParam()" show-md-period="showMdPeriod();"
				  add-section-rate="addSectionRate()" initial-scale-list="initialScaleList"></distribution>
</div>

JS部分

app.directive("distribution", function () {
    return {
        restrict: 'AE',
        scope: {
            params:'=',
            rule: '=',
            oldFlag: '=',
            oldRule: '=',
            model: '=',
            subParam: '=',
            dateSubParam: '=',
            onRuleChange: '&',
            showMdPeriod: '&',
            addSectionRate : '&',
            initialScaleList : '='
        },

其中scope部分的符号，可以参考：https://www.cnblogs.com/mafeifan/p/5817626.html

@

单项绑定的前缀标识符
使用方法：在元素中使用属性，好比这样<div my-directive my-name="{{name}}"></div>，注意，属性的名字要用-将两个单词连接，因为是数据的单项绑定所以要通过使用{{}}来绑定数据。

=

双向数据绑定前缀标识符
使用方法：在元素中使用属性，好比这样<div my-directive age="age"></div>,注意，数据的双向绑定要通过=前缀标识符实现，所以不可以使用{{}}。

<

单项绑定的前缀标识符，和=使用类似。不同的是改变内部scope不会反映到parent的scope

使用方法：在元素中使用属性，好比这样<my-component my-attr="parentModel">,directive的定义scope: { localModel:'<myAttr' }。代码

&

绑定函数方法的前缀标识符
使用方法：在元素中使用属性，好比这样<div my-directive change-my-age="changeAge()"></div>，注意，属性的名字要用-将多个个单词连接。

'<table class="form-table floatL">' +
					'<tbody>' +
						'<tr ng-repeat="initialScaleInfo in initialScaleList" on-finish-render-filters>' +
							'<td class="textCenter border-R-e3">\n' +
								'<div style="float: left"><input type="text" ng-change="onRuleChange();" ng-model="initialScaleList[$index].month" id="initialScaleListMonth_{{$index}}" style="width:14px;"/></div>' +
								'<div style="float: left; margin-top: 8px;">&nbsp月&nbsp&nbsp</div>' +
								'<div style="float: left"><input type="text" ng-change="onRuleChange();" ng-model="initialScaleList[$index].day" id="initialScaleListDay_{{$index}}" style="width:14px;"/></div>' +
								'<div style="float: left; margin-top: 8px;">&nbsp日&nbsp&nbsp</div>' +
								'<div ng-click="deleteSectionRate($index);onRuleChange()" style="margin-right:-53px; background: red;"' +
									'class="panel-btn look-product floatR margL5">' +
									'删除' +
								'</div>' +
							'</td>' +
						'</tr>' +
					'</tbody>' +
				'</table>' +
				'<div class="clearFloat"></div>' +
				'</div>' +
			'</div>',
link: function ($scope) {
	// 分配频率添加按钮
	$scope.deleteSectionRate = function(index) {
		$scope.initialScaleList.splice(index, 1);
	}
}

欢迎关注微信号【Java小灶台】，一起学习