2017-02-20 31 views
1

嗨有什麼辦法可以爲此html做出指示。我必須檢查語言類型是否爲​​然後應用float:right否則如果語言類型爲english則不應用任何內容。如果我只有兩個條件,我該如何制定指令? - Angular Js

<div ng-show="show_div"> 
    <div class="aa-properties-content-head mg-bt-10 font-size-13" ng-if="$root.lg_type =='en'"> 
    <div data-ng-repeat="variant in variants"> 
     <div class="col-md-{{columns}} col-sm-12 col-xs-12"> 
     <label for="text">{{variant.name}}:</label> 
     <input type="text" name="variant_value{{$index}}" class="form-control" ng-model="variant.variant_value" ng-blur="search_category()" placeholder="{{$root.translated_labels.dashboard.enter}} {{variant.name}}" ng-minlength="2" ng-maxlength="30" required> 
     </div> 
    </div> 
    <div class="col-md-{{columns}}"> 
     <label for="item_price">{{$root.tl['product-variant'].price}}:</label> 
     <input class="form-control" name="price" ng-model="search_price" placeholder="{{$root.translated_labels.dashboard.item_price}}" ng-minlength="1" ng-maxlength="20" id="item_price" type="text" required> 
    </div> 
    <div class="col-md-{{columns}}" id="prod_type_dd"> 
     <label for="product_type_id">{{$root.tl.product.product_type_id}}:</label> 
     <input type="text" ng-model="product_type_id" placeholder="{{$root.translated_labels.dashboard.select_type}}" uib-typeahead="producttype.id as producttype.name for producttype in producttype_data | filter:$viewValue | limitTo:4" typeahead-input-formatter="formatLabel($model)" 
     class="form-control"> 
    </div> 
    </div> 


    <div class="aa-properties-content-head mg-bt-10 font-size-13" ng-if="$root.lg_type =='ar'"> 
    <div data-ng-repeat="variant in variants"> 
     <div class="col-md-{{columns}} col-sm-12 col-xs-12 float-right"> 
     <label for="text">{{variant.name}}:</label> 
     <input type="text" name="variant_value{{$index}}" class="form-control" ng-model="variant.variant_value" ng-blur="search_category()" placeholder="{{$root.translated_labels.dashboard.enter}} {{variant.name}}" ng-minlength="2" ng-maxlength="30" required> 
     </div> 
    </div> 
    <div class="col-md-{{columns}} float-right"> 
     <label for="item_price">{{$root.tl['product-variant'].price}}:</label> 
     <input class="form-control" name="price" ng-model="search_price" placeholder="{{$root.translated_labels.dashboard.item_price}}" ng-minlength="1" ng-maxlength="20" id="item_price" type="text" required> 
    </div> 
    <div class="col-md-{{columns}} float-right" id="prod_type_dd"> 
     <label for="product_type_id">{{$root.tl.product.product_type_id}}:</label> 
     <input type="text" ng-model="product_type_id" placeholder="{{$root.translated_labels.dashboard.select_type}}" uib-typeahead="producttype.id as producttype.name for producttype in producttype_data | filter:$viewValue | limitTo:4" typeahead-input-formatter="formatLabel($model)" 
     class="form-control"> 
    </div> 
    </div> 
</div> 

如何將controller的數據傳遞給指令?我已經從控制器加載數據,但是我不知道如何在指令中傳遞它,然後再次將它傳遞給控制器​​。

回答

1

你是說這樣做?

.directive('alignmentBlock', function() { 
    return { 
    restrict: 'A', 
    link: function(scope, elem, attr, ctrl) { 
     if(scope.arabic) 
     elem.css({'float': 'right'}); 
    } 
    }; 
}); 

評估您是否更新布爾範圍變量,無論用戶是否切換到阿拉伯語/非阿拉伯語。

然後在HTML中你可以只使用這個指令是這樣的:

<div alignmentBlock> 
    <p>your text</p> 
</div> 
+0

okaye如果我有rootscope我會怎麼做這個 –

+0

阿拉伯語值,你可以和根範圍內傳遞到鏈接功能範圍:以rootScope替代作用域 – Alex

相關問題