আমি / কীভাবে গোঁফ.জেএস এ কীভাবে সম্পাদন করব?

Question

এটি অদ্ভুত বলে মনে হচ্ছে যে আমি গোঁফে এটি কীভাবে করব তা বুঝতে পারি না। এটি কি সমর্থিত?

এটি চেষ্টা করার জন্য আমার দুঃখজনক চেষ্টা:

    {{#author}}
      {{#avatar}}
        <img src="{{avatar}}"/>
      {{/avatar}}
      {{#!avatar}}
        <img src="/images/default_avatar.png" height="75" width="75" />
      {{/avatar}}
    {{/author}}

এটি স্পষ্টতই সঠিক নয়, তবে ডকুমেন্টেশনে এ জাতীয় কোনও উল্লেখ করা হয়নি। "অন্য" শব্দটি এমনকি উল্লেখ করা হয়নি :(

এছাড়াও, গোঁফ কেন এইভাবে ডিজাইন করা হয়েছে? এই ধরণের জিনিসটিকে খারাপ বলে বিবেচনা করা হয়? এটি কি আমাকে মডেলটিতেই ডিফল্ট মান সেট করতে বাধ্য করার চেষ্টা করছে? যেসব ক্ষেত্রে সম্ভব না সেগুলি সম্পর্কে কী?

Comments

"গোঁফ কেন এভাবে ডিজাইন করা হয়েছে?" আমি খুব বেশি নিশ্চিত নই, তবে আমি মনে করি এই ধারণাটি যে একটি টেম্প্লেটিংয়ের ভাষা ঠিক সেটাই হওয়া উচিত: টেমপ্লেট লেখার জন্য একটি ভাষা, অর্থাত্ তারা যে আউটপুট তৈরি করে তার মতো দেখায়, যেখানে ভেরিয়েবল বিটগুলি যায় সেখানে গর্ত থাকে। টেমপ্লেট ল্যাঙ্গুয়েজে লজিক রাখা টেমপ্লেটগুলিকে আরও জটিল করে তোলে এবং যখন আপনি ইতিমধ্যে লজিক বিটগুলি পরিচালনা করতে একটি প্রোগ্রামিং ভাষা পেয়েছেন, কেন বিরক্ত করবেন?

— পল ডি ওয়েট

@ PaulD.Waite "লজিক-কম" এর অর্থ আসলে "অ-স্বেচ্ছাসেবক কোড," আমার ধারণা। কোডে সত্য দর্শনের যুক্তি যুক্ত করা যেমন খারাপ, তেমনি কোনও টেমপ্লেটে অ-দর্শন যুক্তিকে যুক্ত করা। গোঁফ এটি সম্পাদন করার জন্য খালি ন্যূনতম যুক্তি সরবরাহ করার চেষ্টা করে।

— jpmc26

অথবা গোঁফের পরিবর্তে হ্যান্ডেলবার ব্যবহার করুন । লিখতে সক্ষম হওয়া, যেমন {{#each items}}{{#unless @first}}Output comma before 2nd, 3rd, 4th...{{/unless}}{{/each}}আরও পঠনযোগ্য, অনেক বেশি ক্লিনার এবং এখনও উপস্থাপনা is "লজিক-কম" একটি গাইডলাইন, এটি স্ট্রেইট জ্যাকেট হতে হবে না।

— skierpage

কোনও ওপি যখন বলে "সম্ভবত এটি আমার দুঃখজনক প্রচেষ্টা [...] এটি স্পষ্টতই সঠিক নয়" ... এবং তারপরে স্বীকৃত উত্তরটি সেই কোডটির একটি অনুলিপি-পেস্ট হবে :) it's ওপি বা উত্তর সম্পর্কে কোনও রায় নেই; সবেমাত্রmustache

— ডোয়ান্ডারসন

Answer 1

আপনি যদি অন্যভাবে গোঁফ (পুরোপুরি সমর্থিত) তে থাকেন তবে:

{{#repo}}
  <b>{{name}}</b>
{{/repo}}
{{^repo}}
  No repos :(
{{/repo}}

বা আপনার ক্ষেত্রে:

{{#author}}
  {{#avatar}}
    <img src="{{avatar}}"/>
  {{/avatar}}
  {{^avatar}}
    <img src="/images/default_avatar.png" height="75" width="75" />
  {{/avatar}}
{{/author}}

ডক্সে উল্টানো বিভাগগুলি দেখুন: https://github.com/janl/mustache.js

Comments

গোঁফ ডকগুলি হাসিখুশি। "আমরা এটিকে" যুক্তি-কম "বলি কারণ বিবৃতি, অন্য ধারা বা লুপের জন্য যদি থাকে না।" Yeeeeaaaaaa ....

— boxed

@ বাক্সড, প্রযুক্তিগতভাবে আপনি ঠিক বলেছেন, উল্টানো বিভাগটি একটি লজিক্যাল স্টেটমেন্ট, কারণ এটি ট্যাগ মানটি পরীক্ষা করে। তবে, আমি মনে করি যে এখানে সংক্ষিপ্তসারটি হ'ল উভয় বক্তব্যকে সুস্পষ্টভাবে মূল্যায়ন করতে হবে, একক যদি / অন্যথায় নয়। মূলত, গোঁফ কাঠামোটি if (condition){ //do something}অনুসরণ করে a if (!condition){//do something else}। এছাড়াও, যুক্তিভিত্তিক ভাষার তুলনায় যে কোনও যুক্তিতে যে পরিমাণ যুক্তি সম্পাদন করতে পারে তা হ্রাস পেয়েছে। অস্তিত্ব বা অস্তিত্বই কেবলমাত্র চেক, অর্থাত আপনি কোনও ট্যাগের মান 5 সমান কিনা তা পরীক্ষা করতে পারবেন না এবং তারপরে সেই ট্যাগের কোডের মধ্যে পড়ে।

— মান্ডম

@ ম্যান্ডম হ্যাঁ ... সুতরাং এটিতে যুক্তি রয়েছে তবে এটি কার্যকর কিছু করতে পারে না: পি

— বক্সে

এটি অন্য যুক্তিযুক্ত যদি আপনার সাথে জগাখিচুড়ি থেকে দূরে রাখে। যদি / অন্যথায় ভিতরে নেস্টেড অনেকটা রয়ে অন্য যদি / অন্যথায় misdesign লক্ষণ

— Tebe থেকে

@ বাক্সিত আপনি মাউসচা.জেএস (কমপক্ষে এনজিফোর্ড-ইশ লুপ) এর সাহায্যে লুপের জন্য করতে পারেন

— অলিসডগ

Answer 2

এটি "নিয়ন্ত্রণকারী" এ আপনি সমাধান করেন যা যুক্তিহীন টেম্প্লেটিংয়ের মূল বিষয়।

// some function that retreived data through ajax
function( view ){

   if ( !view.avatar ) {
      // DEFAULTS can be a global settings object you define elsewhere
      // so that you don't have to maintain these values all over the place
      // in your code.
      view.avatar = DEFAULTS.AVATAR;
   }

   // do template stuff here

}

এটি চিত্রের ইউআরএল বা অন্যান্য মিডিয়াগুলি বজায় রাখার পরে এটি অনেক বেশি ভাল যা আপনার টেম্পলেটগুলিতে পরিবর্তন করতে পারে বা নাও পারে, তবে কিছুটা অভ্যস্ত হয়ে যায় takes বিন্দুটি টেমপ্লেট টানেলের দৃষ্টি অপসারিত করা, অবতার ইমগ ইউআরএল অন্যান্য টেম্পলেটগুলিতে ব্যবহার করা আবশ্যক, আপনি কি এক্স টেম্পলেট বা একক ডিফল্ট সেটিংস অবজেক্টে সেই ইউআরএল বজায় রাখতে চলেছেন? ;)

আর একটি বিকল্প নিম্নলিখিতটি করা হয়:

// augment view
view.hasAvatar = !!view.avatar;
view.noAvatar = !view.avatar;

এবং টেমপ্লেটে:

{{#hasAvatar}}
    SHOW AVATAR
{{/hasAvatar}}
{{#noAvatar}}
    SHOW DEFAULT
{{/noAvatar}}

কিন্তু এটি যুক্তিহীন টেম্প্লেটিংয়ের পুরো অর্থের বিপরীতে চলেছে। যদি আপনি এটি করতে চান তবে আপনি লজিকাল টেম্প্লেটিং করতে চান এবং আপনার গোঁফ ব্যবহার করা উচিত নয়, যদিও নিজেকে এই ধারণাটি শেখার উপযুক্ত সুযোগ দিন;)

Comments

ধন্যবাদ। এটি একটি দুর্দান্ত প্রতিক্রিয়া! এটি জাভাস্ক্রিপ্ট কোডের কাঠামোতে "কখন জিনিসগুলি করতে হবে" সম্পর্কে খুব অন্যান্য কাঠামোগত দিকগুলি সম্পর্কে আমাকে সহায়তা করেছিল।

— ইগারোয়ারি

এই উত্তরে {{/ # hasAvatar}} এবং {no / # noAvatar} be হওয়া উচিত। {/ hasAvatar}} এবং {{/ noAvatar}।।

— মুলহুন

Answer 3

আপনার অন্য বিবৃতিটি দেখতে এইরকম হওয়া উচিত (দ্রষ্টব্য ^:)

{{^avatar}}
 ...
{{/avatar}}

গোঁফগুলিতে একে 'ইনভার্টেড বিভাগ' বলা হয়।

Comments

মনে রাখবেন যে আপনার # এবং both উভয়েরই দরকার নেই, এটি 'নন' কেসের জন্য মাত্র

— zappan

এটি সর্বশেষতম সংস্করণে কাজ করে না। Zappan সঠিক হলে আপনি শুধুমাত্র ^ প্রয়োজন

— simonmorley

Answer 4

আপনি ভিউতে কোনও সহায়ককে সংজ্ঞায়িত করতে পারেন। তবে শর্তাধীন যুক্তি কিছুটা সীমাবদ্ধ। ম্যাক্সি-স্টেনসিল ( https://github.com/dcmox/moxyscript-stencil ) "প্যারামিটারাইজড" সহায়কগুলির সাহায্যে এটিকে সম্বোধন করছে বলে মনে হয়:

para Aএকটিভ পরম}

এবং দেখুন:

view.isActive = ফাংশন (পথ: স্ট্রিং) {ফেরার পথ === এই.পথ? "শ্রেণি = 'সক্রিয়'": ''}

Answer 5

দ্রষ্টব্য, আপনি {{.}}বর্তমান প্রসঙ্গ আইটেমটি রেন্ডার করতে ব্যবহার করতে পারেন ।

{{#avatar}}{{.}}{{/avatar}}

{{^avatar}}missing{{/avatar}}