2

私は口ひげに全く慣れていません、そしてこれは私がそれを試している私の最初のプロジェクトです。kohana3.2とKostacheモジュールおよび口ひげのPHP実装で使用します。

私はスポーツトーナメントのコレクションを持っており、それぞれに多くのイベントがあり、各イベントには「結果」と呼ばれる3つのエンティティがあります。私の仕事は、それらすべてを1つのテーブルに表示することです。次のテンプレートは、このテーブルを表示する方法を示しています。

{{#tournaments}}
    <h2>{{name}}</h2>
    <table class="event_list">
        {{#events.find_all}}
            <tr>
                <td>{{day}}</td>
            {{#outcomes.find_all}}
                <td class="outcome">{{name}}</td>
            {{/outcomes.find_all}}
            </tr>
        {{/events.find_all}}
    </table>
{{/tournaments}}

そして今、私の問題、したがって質問に行きます。「結果」を示している間、私はそれぞれに追加の異なるクラスを添付する必要があります。つまり、イベントごとに3つの「結果」があり、それぞれに3つの異なるCSSクラスがあります。しかし、{{＃outcomes.find_all}}ループ内では、それが最初のエンティティであるか、2番目または3番目であるかはわかりません。これについて何ができますか？

これを解決するために、関数の使用を考えていました。このビューのクラスに、すべてのイベントを「結果」としてレンダリングする関数を追加することを考えました。これは次のようになります。

{{#tournaments}}
    <h2>{{name}}</h2>
    <table class="event_list">
        {{#events.find_all}}
            <tr>
                <td>{{day}}</td>
                {{print_outcomes}}
            </tr>
        {{/events.find_all}}
    </table>
{{/tournaments}}

しかし、明らかに私はその関数で「結果」のコレクションを渡す必要があり、それから私はその関数で何も渡すことができないことに気づきました。では、そのような問題は口ひげでどのように解決されたのでしょうか？

また、私がこのような非常に単純な関数を持っている場合：

public function print_outcomes(){
    return "<td>aa</td>";
}

出力に出力する前にurl_encodeを通過するので、次のようになります。

&lt;td&gt;aa&lt;/td&gt;

それは修正できますか？

4

2 に答える 2

1

次のようなビューモデルの関数を試すことができます。

public function outcomes()
{
    $outcomes = ORM::factory('outcome')->find_all();

    $result = array();

    foreach ($outcomes as $outcome) 
    {
        $push = $outcome->object();

        $push['name']  = $outcome->name;
        $push['class'] = 'class_'.$outcome->name;

        $result[] = $push;
     } 
     return $result;
}

それからあなたの口ひげにはこのようなものがあります：

{{#outcomes}}
    <td class="{{class}}">{{name}}</td>
{{/outcomes}}
于 2012-07-25T00:30:32.463 に答える
0

Mustacheはロジックがないため、必要なすべてのロジック（単純な存在チェックとループを除く）は、入力として使用するJSONにロジックを含めることによって実行する必要があります。

基本的に、すべての変数（cssクラスなど）をjsonにエンコードする必要があります。

あなたの例に従って、以下のJSONとテンプレートを参照してください（テストされていませんが、これでうまくいくはずです）

JSON

{      
  tournaments:[
    {
      name: "tournamentA",
      events: [
        {
           day: "day1",
           outcomes:[
             {
                name: "outcomeTypeA",
                cssClass: "classA"
             },
             {
                name: "outcomeTypeB",
                 cssClass: "classB"
             },
             {
                name: "outcomeTypeC",
                cssClass: "classC"
             }
           ]
        },
        {
          //another event of tourA
        }
      ]
    }, 
    {
      //tournamentB, etc .
    }
  ] 
}

レンプレート

{{#tournaments}}
 <h2>{{name}}</h2>
 <table class="event_list">
     {{#events}}
         <tr>
             <td>{{day}}</td>
             {{#outcomes}}
                <td class="outcome {{cssClass}}">{{name}}</td>
             {{/outcomes}}
         </tr>
     {{/events}}
 </table> 
{{/tournaments}}

実際、同様の方法で関数を使用することもできます。つまり、必要な場所に関数をjsonに埋め込みます。この場合、これはやり過ぎですが。

しかし、refの場合は次のようになります。

JSON

{      
  tournaments:[
    {
      name: "tournamentA",
      events: [
        {
           day: "day1",
           outcomes:[
             {
                name: "outcomeTypeA",
                 cssClass: function(){
                    return "classA";
                 }
             },
             {
                name: "outcomeTypeB",
                 cssClass: function(){
                    return "classB";
                 }
             },
             {
                name: "outcomeTypeC",
                 cssClass: function(){
                    return "classC";
                 }
             }
           ]
        },
        {
          //another event of tourA
        }
      ]
    }, 
    {
      //tournamentB, etc .
    }
  ] 
}

これは何度も繰り返されるので、ヘルパーに外部化することができます

JAVASCRIPT：

 var myHelper = function(param){
   return "class"+param;
 }

JSON

 .... {
        name: "outcomeTypeA",
        cssClass: function(){
          return myHelper("A");
        }
     },....

または、「名前」から推測することでおそらくより良い

 .... {
        name: "outcomeTypeA",
        cssClass: function(){
          return myHelper(this); //this refers to object literal on this level 
                                 //containing 2 properties: 'name' and 'cssClass'
        }
     },....

その後：

 var myHelper = function(obj){
   var param = obj.name.substring(obj.name.length-2); //get last char from 'name'-prop
   return "class"+param;
 }
于 2012-07-09T17:10:03.257 に答える