2016-04-14 11 views
2

私は次の書くことができますこのバインディングの時間を節約することができます。角度で

私はクラスでng-bindを使用しようとしましたが、動作しません。

class="ng-bind : 'DayTypesClasses[request.typeId]'" 
class="ng-bind = 'DayTypesClasses[request.typeId]'" 
class="ng-bind : DayTypesClasses[request.typeId]" 
class="ng-bind:{{DayTypesClasses[request.typeId]}}" 

私はクラス属性にどのように正しくをng-bind使用する必要がありますか?

Link on documentation of ng-bindは私を助けていません:(

+0

あなたは 'クラス= "NG-バインド:{{DayTypesClasses [request.typeId]}} '" しようとしたのですか? –

+0

@sarvesh - 'class =" ng-bind:dayoff "'のようなものを返しますが、 'class =" dayoff "でなければなりません" – demo

+0

_ "ng-bindは同じものを作ることができます" _これが真実ではないことを理解するために、文書の最初の文を読んでください。 – zeroflagL

答えて

2

あなたはng-class、どちらか

<ANY ng-class="expression"> ... </ANY> 
を使用することができます

または

01例えば
<ANY class="ng-class: expression;"> ... </ANY> 

:あなたが期待している何

<p ng-class="{strike: deleted, bold: important, 'has-error': error}">Some example</p> 
+0

ハァッ、はい、これは役に立ちます:) – demo

0

これは、標準の例であると取り組んでいる:

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Example - example-example61-production</title> 


    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script> 



</head> 
<body ng-app="bindExample"> 
    <script> 
    angular.module('bindExample', []) 
    .controller('ExampleController', ['$scope', function($scope) { 
     $scope.name = 'Whirled'; 
    }]); 
</script> 
<div ng-controller="ExampleController"> 
    <label>Enter name: <input type="text" ng-model="name"></label><br> 
    Hello <span class="ng-bind: name"></span>! 
</div> 
</body> 
</html> 

Plunker

+0

Emm、この例では、css-classのようなものをバインドしません。代わりに 'Whirled'を' Hello'に追加します – demo

+0

ng-class指示文を使うべきでしょう:https://docs.angularjs.org/api/ng/directive/ngClass – thegio

1

は、クラスに、あなたがng-classを使用することができ、そのために$scope変数の値を置き換えることです。あなたはそのコンセプトを誤解しています。 ng-bindは、さまざまな方法で使用でき、属性値のインスタントタグに可変文字の内容を追加するディレクティブです。

私はng-classを両方の方法で使用しました。 More about ng-class

<div ng-app> 
    <h2>Todo</h2> 
    <div ng-controller="TodoCtrl"> 

    <span class="ng-class:myClass">Demo text</span> 
    <span ng-class="myClass">Demo text</span> 
    </div> 
</div> 

JSFiddle