0

私はこの作業コード (以下) を持っています。これは機能し、適切に機能しますが、最適ではありません。$watch メソッドで書き直すのを手伝ってもらえますか? 私はいくつかの試みをしましたが、うまく いきませんでした。

http://jsfiddle.net/Tb9j5/8/

function dialogWindows($scope) {
    $scope.alpeic = [];
    $scope.compute=function()
    {
        $scope.alpeic.push(1);
        $scope.records = [
        {id:0,
         link:$scope.alpeic.length > 5 ? "alpeic.html" : "",
         className:$scope.alpeic.length > 5 ? "special" : "normal",
         item:"This is item A"},
        {id:1,
        link:$scope.alpeic.length > 5 ? "alpeic.html" : "",
        className:$scope.alpeic.length > 5 ? "special" : "normal",
         item:"This is item B"}];
    }

    $scope.compute();

}
4

2 に答える 2

3

ng-style混ぜて使いng-classます。

参照:

  • ng-class - CSS スタイルのセットが静的/事前にわかっている場合に使用
  • ng-style - スタイルの値が動的に変化する可能性があるため、CSS クラスを定義できない場合に使用します。

例えば:

 <div ng-repeat="record in records"> 
        <a href="{{record.link}}">
            <div
                ng-style="myStyle()"
                ng-class="{true: 'special', false: 'normal'}[alpeic.length > 5]"
             >{{record.item}}
            </div>
        </a> 
    </div>

そしてコントローラーで:

  $scope.myStyle = function () {
    var style = {};

    if ($scope.alpeic.length > 5) {
        style = {"font-size": 30 + 'px'};
    } else {
        style = {"font-size": ($scope.alpeic.length + 12) + 'px'};
    }
    return style;
};

デモFiddle

于 2013-11-02T19:18:17.050 に答える
2

ng-classを含むいくつかの javascript を評価し、そのlength中で使用されるすべての変数はスコープ プロパティです。たとえば、次のようになります。

<div ng-class="{'normal':alpeic.length <=5, 'special':alpeic.length >5 }"  >

キーがクラス名で、値がスコープに基づく js 式、またはブール値である単純なスコープ変数であるオブジェクトを作成します。

ブール変数は!ng-class内でも使用できます

DEMO

于 2013-11-02T23:38:14.577 に答える