在angular js(1.2.18)内的指令的模板url中使用属性值

时间:2019-07-19 09:11:07

标签: angularjs angularjs-directive

我使用了指令可以在angular js中编辑bootstrap。 它对于一个模板可以正常工作,但是问题是我需要有条件的多个模板。

在html页面中,我使用了以下指令。

<span isactive="{{rec.IsActive}}" vdstatus="rec" xeditableact></span>

Vd_Active_Icon.html文件中的

如下。

<a title="Active" data-status="{{VdInfo.IsActive}}" id="VStatus_{{VdInfo.VendorId}}" data-value="1" data-pk="{{VdInfo.VendorId}}" class="fa fa-check-circle excludetooltip text-success"></a>

在angular js创建的指令中,如下所示。

return {
    restrict: 'A',       
    scope: {
        VdInfo: '=vdstatus'
    },
    replace: true,
   // template: '<ng-include src="template"/>',
    templateUrl: function (elem, attrs) {
        console.log(attrs.isactive);//it returns {{rec.IsActive}}.want to evalute this value.
        //i want some thing as below one.
        //if(attrs.isactive){return 'path1';}else{return 'path2';}
        return '/Angular/Controller/Vd_Active_Icon.html'
    },

    link: function (scope, elem, attrs, ctrl) {
        // below way its working but bootstrap editable not working. it just updated html. so cannot use.
         //scope.template = '/Angular/Controller/Vd_Active_Icon.html';
        elem.editable({

                type: "select",
                url: "/Vendor/ToggleVendorStatus",                                        
                params: function (params) {  
                    var data = {};
                    data['id'] = scope.VdInfo.VendorId;//params.pk;
                    return data;
                },
                source: [
                    { value: 1, text: 'Active' },
                    { value: 0, text: 'Inactive' },
                ],
                success: function (data) {

                }
            });

    }
};

0 个答案:

没有答案