ቅንብር ደንቦች

3

የተተረጎመው መጠን

በዚህ ምዕራፍ:

  • ስለሚትዩር ቅንብር ደንቦች ማዘጋጃ ቋንቋ፤ ሃንድልባርስ ይማሩ።
  • የመጀመሪያ ሦስት የቅንብር ደንቦችዎን ይፍጠሩ።
  • የሚትዩር ኣስተዳዳሪዎች እንዴት ሥራ እንደሚሰሩ ይረዱ።
  • ኣንድ መሰረታዊ ናሙናን በማይንቀሳቀስ መረጃ እንዲሰራ ያድርጉት።
  • ////

    ////

    ////

    <head>
      <title>Microscope</title>
    </head>
    <body>
      <div class="container">
        <header class="navbar">
          <div class="navbar-inner">
            <a class="brand" href="/">Microscope</a>
          </div>
        </header>
        <div id="main" class="row-fluid">
          {{> postsList}}
        </div>
      </div>
    </body>
    
    client/main.html

    ////

    የሚትዩር ቅንብር ደንቦች

    ////

    ////

    ፍይሎችን ማግኘት

    ////

    ////

    ////

    <template name="postsList">
      <div class="posts">
        {{#each posts}}
          {{> postItem}}
        {{/each}}
      </div>
    </template>
    
    client/views/posts/posts_list.html

    ////

    <template name="postItem">
      <div class="post">
        <div class="post-content">
          <h3><a href="{{url}}">{{title}}</a><span>{{domain}}</span></h3>
        </div>
      </div>
    </template>
    
    client/views/posts/post_item.html

    ////

    ////

    ////

    ////

    ////

    ተጨማሪ መረጃ

    ////

    ////

    ////

    ////

    ////

    ////

    የቅንብር ደንቦች ኣስተዳዳሪዎች

    ////

    ////

    ////

    ኣስተዳዳሪዎች?

    ////

    ////

    ////

    ////

    var postsData = [
      {
        title: 'Introducing Telescope',
        author: 'Sacha Greif',
        url: 'http://sachagreif.com/introducing-telescope/'
      }, 
      {
        title: 'Meteor',
        author: 'Tom Coleman',
        url: 'http://meteor.com'
      }, 
      {
        title: 'The Meteor Book',
        author: 'Tom Coleman',
        url: 'http://themeteorbook.com'
      }
    ];
    Template.postsList.helpers({
      posts: postsData
    });
    
    client/views/posts/posts_list.js

    ////

    Our first templates with static data
    Our first templates with static data

    ኣከማች 3-1

    Added basic posts list template and static data.

    ////

    ////

    ////

    <template name="postsList">
      <div class="posts">
        {{#each posts}}
          {{> postItem}}
        {{/each}}
      </div>
    </template>
    
    client/views/posts/posts_list.html

    ////

    የ"this" እሴት

    ////

    Template.postItem.helpers({
      domain: function() {
        var a = document.createElement('a');
        a.href = this.url;
        return a.hostname;
      }
    });
    
    client/views/posts/post_item.js

    ኣከማች 3-2

    Setup a `domain` helper on the `postItem`.

    ////

    Displaying domains for each links.
    Displaying domains for each links.

    ////

    ////

    ////

    ////

    የጃቫስክሪፕት ምትሀት

    ////

    ////

    ////

    ////

    ትኩስ ኮድ ዳግም ማስገባት

    ////

    ////

    ////