ডাবল কোঁকড়া ধনুর্বন্ধনী সঙ্গে AngularJS-Twig দ্বন্দ্ব


198

যেমনটি আপনি জানেন, উভয় কৌণিক এবং ডানাগুলি সাধারণ নিয়ন্ত্রণ নির্মাণ - ডাবল কোঁকড়া ধনুর্বন্ধনী। আমি কৌনিকটির ডিফল্ট মানটি কীভাবে পরিবর্তন করতে পারি?

আমি জানি যে আমি এটি ট্যুইগে করতে পারি, তবে কিছু প্রকল্পে আমি পারি না, কেবল জেএস।



10
গোঁফ পাগলের জন্য আরেকটি দ্বি-নির্দিষ্ট সমাধান হ'ল verbatimট্যাগটি ব্যবহার করা ; উদাহরণ: {% verbatim %}{{ angular_var }}{% endverbatim %}: AngularJS জন্য আপনার গোঁফের সংরক্ষণে twig.sensiolabs.org/doc/tags/verbatim.html
Darragh Enright

প্রশ্নের লেখক নয়, ভবিষ্যতের পাঠকগণ: আপনি যদি এই প্রশ্নের উত্তর খুঁজছেন তবে সার্ভারের পক্ষ থেকে আদৌ টেমপ্লেটগুলি এড়াতে বিবেচনা করুন, যদি আপনি এটি সামর্থ্য করতে পারেন (যদি আপনার মূল বিষয়বস্তু সত্যায়িত অঞ্চলে থাকে বা আপনি মূল অনুসন্ধান ইঞ্জিনে থাকেন) ট্র্যাফিকের উত্স হিসাবে গুগল (তারা জেএস এসপিএ পার্স করতে পারে)।
ওজেড

1
@OZ_ মত AngularJS বিরুদ্ধে সার্চ ইঞ্জিন যুক্তি এবং বেশ অপ্রয়োজনীয় যখন মত পরিষেবাগুলি ব্যবহার হয়ে prerender.io
ই সুন্দিন

উত্তর:


287

আপনি interpolateProviderপরিষেবাটি ব্যবহার করে শুরু এবং শেষ ইন্টারপোলেশন ট্যাগগুলি পরিবর্তন করতে পারেন । এর জন্য একটি সুবিধাজনক জায়গা হ'ল মডিউল শুরুর সময়।

angular.module('myApp', []).config(function($interpolateProvider){
    $interpolateProvider.startSymbol('{[{').endSymbol('}]}');
});

https://docs.angularjs.org/api/ng/provider/$interpolateProvider


5
যদিও আমি [[]] ব্যবহার করব না। এটির মতো কিছু বাঁধার ক্ষেত্রে এটি খারাপ হতে পারে:[[myObject[myArray[index]]
অ্যান্ড্রু জোসলিন

1
সত্য। আমি {[{}]}টাইপ করতে কিছুটা বিজোড় হলেও জ্যাঙ্গোর সাথে ব্যবহার করি । আমি উত্তর আপডেট করেছি।
অভাগ

4
ধন্যবাদ! জেকল / লিকুইড এবং কৌণিক জেএসের সাথে একই ধরণের সমস্যার সমাধান হয়েছে। আমি {[এবং] for এর জন্য বেছে নিয়েছি}
jfroom

7
3 লাইনে 3 এর পরে কি সেমিকোলনটি সরানোর দরকার নেই?
ক্যাশসক্লে

কৌণিক স্তরে বিশ্ব স্তরে এটি করার কোনও উপায় আছে কি? আমাদের ওয়েবসাইটে বিভিন্ন পৃষ্ঠাতে অনেকগুলি, অনেকগুলি মডিউল থাকবে এবং আমরা এটি করতে ভুলে যেতে চাই না।
theY4Kman

89

এই প্রশ্নের উত্তরটি উপস্থিত হয়, তবে একটি আরও মার্জিত সমাধান যা উল্লেখ করা হয়নি, তা হ'ল কোঁকড়ানো ধনুর্বন্ধনী ধনুগুলির মধ্যে উদ্ধৃতি চিহ্নগুলিতে কোঁকড়া ধনুর্বন্ধনী বন্ধ করা, যেমন:

{{ '{{myModelName}}' }}

আপনি যদি বিষয়বস্তুগুলির জন্য কোনও পরিবর্তনশীল ব্যবহার করে থাকেন তবে পরিবর্তে এটি করুন:

{{ '{{' ~ yourvariable ~ '}}' }}

আপনার একক উদ্ধৃতি ব্যবহার করা উচিত , ডাবল কোট নয়। ডাবল কোটগুলি টুইগ দ্বারা স্ট্রিং সংযোগকে সক্ষম করে যাতে আপনাকে বিষয়বস্তুগুলির সাথে আরও সতর্কতা অবলম্বন করতে হবে, বিশেষত যদি আপনি এক্সপ্রেশন ব্যবহার করছেন।


আপনি যদি এখনও এই সমস্ত কোঁকড়া ধনুর্বন্ধনী দেখে ঘৃণা করেন তবে আপনি প্রক্রিয়াটি স্বয়ংক্রিয় করতে একটি সাধারণ ম্যাক্রোও তৈরি করতে পারেন:

{% macro curly(contents) %}
   {{ '{{' ~ contents ~ '}}' }}
{% endmacro %}

এটিকে ফাইল হিসাবে সংরক্ষণ করুন এবং এটি আপনার টেম্পলেটটিতে আমদানি করুন। আমি ngনামের জন্য ব্যবহার করছি কারণ এটি সংক্ষিপ্ত এবং মিষ্টি।

{% import "forms.html" as ng %}

অথবা আপনি আপনার টেম্পলেটটির শীর্ষে ম্যাক্রো রাখতে পারেন এবং এটি নিজের হিসাবে আমদানি করতে পারেন (এখানে দেখুন) :

{% import _self as ng %}

তারপরে এটি ব্যবহার করুন:

{{ ng.curly('myModelName') }}

এই ফলাফলগুলি:

{{myModelName}}

... এবং যারা টুইগের পাশাপাশি MtHaml ব্যবহার করেন তাদের জন্য একটি ফলোআপ । এমটিএইচএএমএল সাধারণ পদ্ধতিতে অ্যাংুলার জেএস ক্রিলের ব্যবহার সক্ষম করে কারণ যে কোনও টুইগ কোড অ্যাক্সেস করা হলেও - এবং = এর পরিবর্তে {{}}}} উদাহরণ স্বরূপ:

সরল এইচটিএমএল + অ্যাঙ্গুলারজেএস:

<tr ng-repeat="product in products">
   <td> {{ product.name }} </td>
</tr>

এমটিএইচএমএল + কৌণিক জেএস:

%tr(ng-repeat="product in products")
   %td {{ product.name }}

এমটিএইচএমএল + অ্যাঙ্গুলারজেএস এমটিএইচএমএল-স্টাইলের ট্যুইগ সহ:

- set twigVariable = "somevalue"
= twigVariable
%tr(ng-repeat="product in products")
   %td {{ product.name }}

6
এটি সম্ভবত সবচেয়ে মনোরম উপায় নয়, তবে আমার মতে এটি সামঞ্জস্যতা সমস্যা নিয়ে চিন্তা করার একমাত্র উপায় নয়। ইথার পরিবর্তিত কৌণিক বা টুইগ {comp সামঞ্জস্যতা সমস্যা বা খারাপ পোর্টেবিলিটি তৈরি করতে পারে।
Loo Benoist

1
প্রদত্ত সমাধানটি কেবল তখনই আমার পক্ষে কাজ শুরু হয়েছিল যখন আমি এটি চেয়েছিলাম {{'{{contact.name}\}'}} যা {{contact.name}}আমি চাই হিসাবে প্রিন্ট করে
টিমো হুভিনেন

37

জ্যাঙ্গো এবং অ্যাঙ্গুলারজেএস সম্পর্কে একই প্রশ্নে উল্লিখিত হিসাবে, ডিফল্ট চিহ্নগুলি পরিবর্তন করার কৌশল (টুইগ বা অ্যাঙ্গুলারজেএসে) তৃতীয় পক্ষের সফ্টওয়্যারগুলির সাথে অসঙ্গতি সরবরাহ করতে পারে, যা এই চিহ্নগুলি ব্যবহার করবে। তাই গুগলে আমি সর্বোত্তম পরামর্শ পেয়েছি: https://groups.google.com/d/msg/symfony2/kyebufz4M00/8VhF1KWsSAEJ

টুইগবান্ডেল লেক্সার ডিলিমিটরদের জন্য কোনও কনফিগারেশন সরবরাহ করে না কারণ এগুলি পরিবর্তন করা আপনাকে ভাগ করা বান্ডিল দ্বারা সরবরাহিত কোনও টেম্পলেট ব্যবহার করতে নিষেধ করবে (টুইগবান্ডেল নিজেই সরবরাহিত ব্যতিক্রম টেম্পলেটগুলি সহ)।

তবে, সমস্ত কোঁকড়ানো ধনুর্বন্ধনী থেকে দূরে থাকা ব্যথা এড়াতে আপনি আপনার কৌনিক টেম্পলেটগুলির চারপাশে কাঁচা ট্যাগ ব্যবহার করতে পারেন: http://twig.sensiolabs.org/doc/tags/raw.html - ক্রিস্টোফ | Stof

ট্যাগটির ভারব্যাটিম নামকরণ করা হয়েছিল


6
দয়া করে নোট করুন কাঁচা ট্যাগটির কাঁচা ফিল্টারের সাথে বিভ্রান্তি এড়ানোর কারণে কাঁচা ট্যাগটির নাম পরিবর্তন করে "ভারব্যাটিম" করা হয়েছে।
স্টেদেটে

3
এটি আমার মতে সবচেয়ে পরিষ্কার উপায়।
কেমিকোফা ভূত

27

আপনি খুব অ্যাট্রিবিউট-ভিত্তিক নির্দেশনাটি <p ng-bind="yourText"></p>একই হিসাবে ব্যবহার করতে পারেন<p>{{yourText}}</p>


4
এটি অবশ্যই সর্বোত্তম সমাধান হতে হবে।
আলাইন জ্যাকোমেট ফোর্টটি 20'14 এ 22 ই

5
এটি এটারে কীভাবে ব্যবহার করবেন <li id={{item.id}}></li>?
gkiwi

<p data-ng-bind="yourText"></p>এইচটিএমএলকে বৈধ করার জন্য আরও ভাল ব্যবহার করা হবে
জিন-মার্ক জিমার

24

আপনি \{{product.name}}হ্যান্ডলবার্স দ্বারা উপেক্ষা এবং পরিবর্তে কৌণিক দ্বারা ব্যবহৃত অভিব্যক্তি পেতে ব্যবহার করতে পারেন ।


এটি সত্যিই দরকারী ছিল
এডান

ভাল সমাধান - কেবল সংরক্ষিত অক্ষরগুলি
এড়িয়ে চলুন

22

এটি সেরা উত্তরের একটি সংকলিত সংস্করণ এবং ভারব্যাটিম ব্লকগুলির একটি উদাহরণ:

একক সন্নিবেশের জন্য, ব্যবহার করুন:

{{ '{{model}}' }}

অথবা আপনি যদি একটি দ্বৈত ভেরিয়েবল ব্যবহার করেন

{{ '{{' ~ twigVariableWitModelName ~ '}}' }}

ভার্ব্যাটিম , বেশ কৌণিক ভেরিয়েবলের জন্য খুব মার্জিত এবং পাঠযোগ্য:

<table ng-table>
    {% verbatim %}
        <tr ng-repeat="user in $data">
        <td data-title="'Name'">{{user.name}}</td>
        <td data-title="'Age'">{{user.age}}</td>
        </tr>
    {% endverbatim %}
</table>

আহ, এটাই ছিল আমার জন্য জীবন রক্ষাকারী। আমি ফিল্টারটির মধ্যে {{পরম} use ব্যবহার করতে পারিনি: {{{পরম}}: $ select.search} এবং আপনার সমাধান এটি স্থির করেছে। ধন্যবাদ
ব্যালন

19

আপনি যদি বিদ্যমান কৌণিক সিনট্যাক্সের টেমপ্লেট ট্যাগগুলি পরিবর্তন করতে আগ্রহী না হন তবে আপনার বিদ্যমান কৌনিক টেম্পলেটগুলির কিছু বিভ্রান্তিকর পুনর্লিখনের প্রয়োজন হবে।

কেউ কেবল কৌণিক ট্যাগগুলির সাথে টুইগ টেম্পলেট ট্যাগগুলি ব্যবহার করতে পারেন:

{% verbatim %}{{yourName}}{% endverbatim %}

এটি অনুরূপ অন্য থ্রেড উত্তরে পাওয়া গেছে : একটি সিমফনি 2 অ্যাপ্লিকেশনে অ্যাঙ্গুলারজ


1
@ থমাসেগগি ওপি টুইগের সমাধান চাইছে। অন্যান্য উত্তরগুলি দেখুন যা তরলটির পক্ষেও কাজ করতে পারে।
নোয়েল ল্লেভেরেস

18

বিকল্পভাবে আপনি টুইগ দ্বারা ব্যবহৃত অক্ষর পরিবর্তন করতে পারেন। এটি টুইগ_এলেক্সার দ্বারা নিয়ন্ত্রিত হয় ।

$twig = new Twig_Environment();

$lexer = new Twig_Lexer($twig, array(
    'tag_comment'   => array('[#', '#]'),
    'tag_block'     => array('[%', '%]'),
    'tag_variable'  => array('[[', ']]'),
    'interpolation' => array('#[', ']'),
));
$twig->setLexer($lexer);

খুব উপকারী. ধন্যবাদ।
আনোস কে। মাহাজো

17

এই পোস্ট অনুযায়ী আপনার এই মত এটি করতে সক্ষম হতে হবে:

angular.module('app', [])
  .config(['$interpolateProvider', function ($interpolateProvider) {
    $interpolateProvider.startSymbol('[[');
    $interpolateProvider.endSymbol(']]');
  }]);

2
আমি এই কোডগুলি কোথায় রাখব? | উহু! আমি পেয়েছি, আমাকে এনজি-অ্যাপ = অ্যাপ তৈরি করতে হবে
zx1986

কেবলমাত্র AngularJS দিয়ে শুরু করে এবং লারাভেল 4-এর মধ্যে আমি ফ্রেমওয়ার্কটি লোড করেছি এবং তারপরে} {2 + 2} view ভিউতে যুক্ত করেছি - কিছুই নয় এবং এটি 4-তে মূল্যায়ন করা হয়েছে আমি এটিকে পরিবর্তন করার কোডটি কোথায় রাখি [[2+ 2]]? আমি এটিকে একই পৃষ্ঠায় স্ক্রিপ্ট ট্যাগগুলির মধ্যে যুক্ত করার এবং এনজিও-অ্যাপ = "মাই অ্যাপ" যুক্ত ডিভ ট্যাগটিতে যুক্ত করার চেষ্টা করেছি কিন্তু এটি কার্যকর হয় না।
পারকিন 5

এটি আপনার জাভাস্ক্রিপ্টে স্থাপন করা দরকার, একই স্থান নিয়ন্ত্রকরা সংজ্ঞায়িত হয়। একটি কার্যকারী উদাহরণের জন্য, স্ক্রিপ্ট.জেএস ট্যাবে ডকুমেন্টেশন ( ডকস.অঙ্গুলারজেএস.আর.পি.আই.সি। ইনটারপোলেটপ্রভাইডার ) দেখুন।
অলিভিয়ার.রোগার

2
সাবধানতার কথা, আমি কৌণিকের জন্য ডাবল বর্গাকার বন্ধনী ব্যবহার করছিলাম, তবে আমি জাজানো বার্তা কাঠামো নিয়ে কেবল একটি সমস্যায় পড়েছি। বার্তাগুলি একটি কুকি তৈরি করে যার মধ্যে [[]] থাকে এবং কৌনিকটি এটি বিশ্লেষণ করার চেষ্টা করে এবং প্রক্রিয়াটি কমে যায়। আমি বার্তাগুলির জন্য সেশন স্টোরেজে স্যুইচ করার চেষ্টা করেছি, তবে একই সমস্যা। আমি ট্রিপল স্কোয়ার বন্ধনীগুলিতে স্যুইচ করেছি।
ডাস্টিন

2

আমি @ পাবলোআরএন পছন্দ করি তবে আমি পি এর পরিবর্তে স্প্যান ব্যবহার করতে পছন্দ করব কারণ আমার জন্য পি ফলাফলের সাথে লাইন যুক্ত করবে।

আমি এটি ব্যবহার করব:

<span ng-bind="yourName"></span>

আমি ডাবল উদ্ধৃতিতে কার্সার সহ টেক্সটও ব্যবহার করি যাতে আমাকে পুরো জিনিসটি বারবার লিখতে হবে না।


আসলে এনজি-বাইন্ড = "" এটিই গুরুত্বপূর্ণ, আপনি নিজের পছন্দ মতো যে কোনও ট্যাগ ব্যবহার করতে পারেন :)
ওয়েসামলি

@ ওয়েসামলি আপনি যে কোনও ট্যাগ ব্যবহার করতে পারেন, তবে <span>আপনার যখন অন্য সামগ্রী রয়েছে তখন ইনলাইন পাঠ্যের জন্য ব্যবহৃত হয়। উদাহরণস্বরূপ:<h1>Welcome <span ng-bind="yourName"></span></h1>
rybo111

1

আপনার কৌনিক নির্দেশকে ঘিরে ধরে আপনি কোনও দ্বিধায়িত একটি ক্রিয়াকলাপ তৈরি করতে পারেন, তাই যাওয়ার পরিবর্তে ...

{{"angular"}}

তুমি যাও ...

{{angular_parser("angular stuff here output curlies around it")}}


আপনার উত্তরগুলিতে কোড স্নিপেট জন্য ব্যবহারকারী কোড ব্লক করুন।
εηοιτ.εηοιτ.βε
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.