Angular.js সিলেক্ট বাক্সে কীভাবে ডিফল্ট অপশন থাকবে

Question

আমি গুগল অনুসন্ধান করেছি এবং এটিতে কিছুই খুঁজে পাচ্ছি না।

আমার এই কোড আছে

<select ng-model="somethingHere" 
        ng-options="option.value as option.name for option in options"
></select>

এর মতো কিছু ডেটা সহ

options = [{
   name: 'Something Cool',
   value: 'something-cool-value'
}, {
   name: 'Something Else',
   value: 'something-else-value'
}];

এবং আউটপুট এই জাতীয় কিছু।

<select ng-model="somethingHere"  
        ng-options="option.value as option.name for option in options" 
        class="ng-pristine ng-valid">

    <option value="?" selected="selected"></option>
    <option value="0">Something Cool</option>
    <option value="1">Something Else</option>
</select>

ডিফল্ট মান হিসাবে ডেটাতে প্রথম বিকল্পটি সেট করা কীভাবে সম্ভব যাতে আপনি এর মতো ফলাফল পেতে পারেন।

<select ng-model="somethingHere" ....>
    <option value="0" selected="selected">Something Cool</option>
    <option value="1">Something Else</option>
</select>

Comments

এটির উত্তর ভাল লাগবে যদি এমন কোনও উত্তর পাওয়া যায় যা ধরে নেয় না যে কৌনিকটি বিকল্পগুলি তৈরি করতে ব্যবহৃত হচ্ছে। বিকল্পগুলি যদি ইতিমধ্যে মার্কআপের অংশ হয় তবে কী হবে?

— pspahn

@pspahn - অনুযায়ী docs.angularjs.org/api/ng/directive/ngOptions : শুধুমাত্র a **single** hard-coded <option> element ... can be nested into the <select> element.অপশন ইতিমধ্যে মার্কআপ অংশ হতে না পারে।

— ডিআইএমএম রিপার

@ স্প্যাসন যে ওপিটির জবাব দেবে না, তবে একেবারে অন্যরকম প্রশ্ন ...

— মারিও ট্রুকো

Answer 1

আপনি খালি এনজি-থ্রি এর মতো ব্যবহার করতে পারেন

<select ng-init="somethingHere = options[0]" 
        ng-model="somethingHere" 
        ng-options="option.name for option in options">
</select>

Comments

এই কাজ করতে আমার একটি সমস্যা হয়েছিল, এটি ছিল যে আমি 'ট্র্যাক বাই' ব্যবহার করছিলাম, এটি মুছে ফেলার ফলে সমস্যাটি ঠিক হয়ে গেল, যদি কেউ কাউকে লাইনে

— দাঁড় করায়

এই উত্তরের সাথে কিছু ভুল হয়নি, তবে এনজি-থ্রি আমার নির্দিষ্ট ক্ষেত্রে আমার জন্য ব্যর্থ হয়েছিল। সমস্যাটি হ'ল এনজি-থ্রেন চলার সময় আমি যে মানটি ব্যবহার করছিলাম সেটি এখনও পাওয়া যায় নি: আমি একটি এজ্যাক্স কলের মাধ্যমে মান পেয়েছিলাম এবং সেই মুহুর্তে এনজি-থ্র ইতিমধ্যে শেষ হয়ে গিয়েছিল। শেষ পর্যন্ত আমি সেই মানটির উপরে একজন প্রহরী ব্যবহার করেছি এবং সেই ফাংশনে আমি এনজি-ইন্ডি-তে যেমন করেছি তেমনটি করেছি। কাজ করেছে।

— মরিটস

আমি খুব বিষয় এই কাজ পেয়ে ছিল, @maurits মন্তব্য এই আমাকে নেতৃত্বে stackoverflow.com/questions/22348886 উপভোগ করুন!

— মাইকেল 16

কৌণিক ডকুমেন্টেশন ভাল মান এই ধরনের আরম্ভের জন্য নিয়ামক $ সুযোগ ব্যবহার করতে বলেছেন docs.angularjs.org/api/ng/directive/ngInit

— ফরচুনা

সতর্কতা: এই উদ্দেশ্যে এনজি-টিআইএন ব্যবহার করার ফলে $ ডাইজেস্ট () পদ্ধতিতে অতিরিক্ত কল আসতে পারে, যা আপনার কনসোল আউটপুটটিকে "10 $ ডাইজেস্ট () পুনরাবৃত্তিতে পৌঁছেছে বার্তাগুলির সাথে সমস্ত লাল এবং কুশ্রী দেখা দিতে পারে Ab

— ডিএমএকে সর্বনাশকারী

Answer 2

$scope.somethingHereআপনার ভিউটি আরম্ভ হওয়ার সাথে সাথে যদি আপনার মানটি ওভাররাইট না হয়ে থাকে তা নিশ্চিত করতে চান , আপনি somethingHere = somethingHere || options[0].valueআপনার এনজি-থ্রি-তে মানটি ( ) একত্রিত করতে চাইবেন :

<select ng-model="somethingHere" 
        ng-init="somethingHere = somethingHere || options[0].value"
        ng-options="option.value as option.name for option in options">
</select>

Comments

এই সমাধানটি ভালভাবে কাজ করেছে এবং নির্বাচিত উত্তরের চেয়ে ভাল।

— এমজে

এনজি-আরএন-কে এই এনজি-থ্রিমের মতো দেখতে পাওয়া উচিত নয় "কিছু এখানে = কিছু এখানে || বিকল্পগুলি [0]" ??

— infinitloop

optionsখালি থাকার সাথে কীভাবে মোকাবিলা করবেন ? optionsবাইরের উত্স থেকে ডেটা আসার মতো ।

— নাল

@ সুদ আপনার নিজের এনজি-ইন-তে বিকল্প ও& অপশনগুলি / দৈর্ঘ্য> 0 পরীক্ষা করা দরকার। সত্যই, এর বেশিরভাগটি আপনার নিয়ামকের মধ্যে করা উচিত, সুতরাং এটি পরীক্ষামূলক।

— বেন লেশ

@ বেনল্যাশ যদি আমি প্রথম বিকল্পের পরিবর্তে কিছু পাঠ্য (স্ট্রিং) লিখতে চাই। ng-init="somethingHere= somethingHere || 'Select one' " আমি এই মত চেষ্টা করেছি। কিন্তু এটি কার্যকর হয়নি। আমার কোডে কী ভুল

— কোডলিটার

Answer 3

এটা চেষ্টা কর:

এইচটিএমএল

<select 
    ng-model="selectedOption" 
    ng-options="option.name for option in options">
</select>

জাভাস্ক্রিপ্ট

function Ctrl($scope) {
    $scope.options = [
        {
          name: 'Something Cool',
          value: 'something-cool-value'
        }, 
        {
          name: 'Something Else',
          value: 'something-else-value'
        }
    ];

    $scope.selectedOption = $scope.options[0];
}

এখানে Plunker ।

আপনি যদি সত্যিই এমন মানটি সেট করতে চান যা মডেলটির সাথে আবদ্ধ হবে, তবে এতে ng-optionsবৈশিষ্ট্যটি পরিবর্তন করুন

ng-options="option.value as option.name for option in options"

এবং জাভাস্ক্রিপ্ট থেকে

...
$scope.selectedOption = $scope.options[0].value;

উপরের দিক বিবেচনা করে এখানে আরও একটি প্লাঙ্কার ।

Comments

সমস্যাটি হল আমাকে নির্বাচিত বাক্সগুলির বোঝার জন্য এটি করতে হবে।

— iConnor

পেল না। আপনি কি করতে হবে?

— মাইকেল বেনফোর্ড

আমি সম্ভবত এটি 50+ নির্বাচনের বাক্সের জন্য ম্যানুয়ালি করতে হবে

— আইকননর

আপনি প্রতিটি নির্বাচিত বাক্সের জন্য ডিফল্ট মান সেট করতে চান? যদি তাই হয় তবে আমি অনুমান করি যে এটি আপনার প্রশ্নে পরিষ্কার নয়। যাইহোক, আমি কি ঠিক ধরে নিচ্ছি যে আপনি প্রত্যেকটি নির্বাচিত বাক্সে আইটেমগুলি লোড করতে হবে? যদি তা হয় তবে আমি মনে করি না যে তাদের ডিফল্ট মানগুলি শুরু করা একটি বড় ব্যাপার।

— মাইকেল বেনফোর্ড

আমার সমস্যাটি হ'ল বিকল্পটির সূচকটি ফর্মের একটি "জমা দিন" থেকে ফিরে আসে। আমার যা প্রয়োজন তা হ'ল আপনি যা কল করছেন বিকল্প নাম। নাম, যা এটি একটি সাধারণ পুরানো রেল ফর্ম থেকে ফিরে এসেছিল। আপনি সঠিক মার্কআপটি পেতে এনজি-রিপিট ব্যবহার করার পরে চেকবক্স এবং রেডিও বোতামগুলি দুর্দান্ত কাজ করে। ফর্ম জমা দেওয়ার সময় কীভাবে অপশন.নাম ফেরত পাব?

— পিফারেল

Answer 4

শ্রীবত্সা হরিশ ভেঙ্কটরমণের কেবলমাত্র একটি জবাব উল্লেখ করেছেন track byযা প্রকৃত পক্ষে এর সমাধান হতে পারে!

নির্বাচিত ক্ষেত্রে কীভাবে ব্যবহার করতে track byহয় তার জন্য এখানে প্লঙ্কার (নীচের লিঙ্ক) সহ একটি উদাহরণ রয়েছে ng-options:

<select ng-model="selectedCity"
        ng-options="city as city.name for city in cities track by city.id">
  <option value="">-- Select City --</option>
</select>

তাহলে selectedCityকৌণিক স্কোপ উপর সংজ্ঞায়িত করা হয়, এবং এটি রয়েছে idকোন হিসাবে একই মান সম্পত্তি idকোনো cityতে citiesতালিকা, এটি লোড নির্বাচিত স্বয়ংক্রিয় হবেন।

এখানে এর জন্য প্লঙ্কার এখানে রয়েছে: http://plnkr.co/edit/1EVs7R20pCffewrG0EmI?p= পূর্বরূপ

আরও তথ্যের জন্য উত্স ডকুমেন্টেশন দেখুন: https://code.angularjs.org/1.3.15/docs/api/ng/directive/select

Comments

ধন্যবাদ এটি আমাকে সাহায্য করেছে;)

— ব্রাহিম লামজাগুয়ার

অসাধারণ! ধন্যবাদ!

— আইউরি গোলসকিই

Answer 5

আমি মনে করি, 'ট্র্যাক বাই' অন্তর্ভুক্ত করার পরে, আপনি যা চান তা পেতে এনজি-অপশনগুলিতে এটি ব্যবহার করতে পারেন, নীচের মত

 <select ng-model="somethingHere" ng-options="option.name for option in options track by option.value" ></select>

এটি করার এই পদ্ধতিটি আরও ভাল কারণ আপনি যখন স্ট্রিংয়ের তালিকার সাথে অবজেক্টের তালিকার সাথে প্রতিস্থাপন করতে চান আপনি কেবল এটিতে পরিবর্তন করবেন

 <select ng-model="somethingHere" ng-options="object.name for option in options track by object.id" ></select>

যেখানে কিছু এখানে বৈশিষ্ট্যের নাম এবং আইডি সহ অবশ্যই একটি বিষয়। দয়া করে মনে রাখবেন, এনজি-বিকল্পগুলি প্রকাশের জন্য 'হিসাবে' ব্যবহার করা হয় না কারণ এটি কেবলমাত্র মান নির্ধারণ করে এবং আপনি যখন ট্র্যাক ব্যবহার করেন তখন আপনি এটি পরিবর্তন করতে পারবেন না

Comments

এটিই আমার পক্ষে কাজ করেছিল। আমি মনে করি কৌনিকটি আমার সুযোগের মডেলটিতে রেফারেন্স তালিকার পছন্দ হিসাবে সমপরিমাণটি চিহ্নিত করতে কিছু দরকার হয়েছিল। "ট্র্যাক বাই গ্যারান্টর.কোড" কৌতুকটি করেছিল!

— মার্কবলডি

Answer 6

গৃহীত উত্তর ব্যবহার করুন ng-init, তবে নথিটি সম্ভব হলে এনজি-থিকে এড়াতে বলে।

নীচের ডেমোতে দেখা যায়, এনজিআইনিটের একমাত্র উপযুক্ত ব্যবহার হ'ল এনজিপিপিটের বিশেষ বৈশিষ্ট্যগুলি হ্রাস করার জন্য। এই ক্ষেত্রেটি ছাড়াও, আপনার স্কোপগুলিতে মানগুলি আরম্ভ করার জন্য এনজিআইনিটের পরিবর্তে আপনার নিয়ামক ব্যবহার করা উচিত।

আপনি আপনার বিকল্পগুলির ng-repeat পরিবর্তে ব্যবহার করতে পারেন ng-options। সঙ্গে ng-repeat, আপনি বিশেষ বৈশিষ্ট্য ng-selectedসঙ্গে ব্যবহার করতে পারেন ng-repeat। যেমন $ সূচক, $ বিজোড়, $ এমনকি কোনও কোডিং ছাড়াই এই কাজটি করতে।

$first এনজি-রিপিট বিশেষ বৈশিষ্ট্যগুলির মধ্যে একটি।

  <select ng-model="foo">
    <option ng-selected="$first" ng-repeat="(id,value) in myOptions" value="{{id}}">
      {{value}}
    </option>
  </select>

---------------------- সম্পাদনা ----------------
যদিও এটি কাজ করে তবে আমি @ মিক-টি পছন্দ করব উত্তর যখন আপনি কি জানেন মান নির্বাচন করতে https://stackoverflow.com/a/29564802/454252 , যা ব্যবহার track-byএবং ng-optionsব্যবহার না করেই ng-initবা ng-repeat।

এই উত্তরটি কেবল তখনই ব্যবহার করা উচিত যখন আপনি কোন মানটি চয়ন করবেন তা না জেনে প্রথম আইটেমটি নির্বাচন করতে হবে। উদাহরণস্বরূপ, আমি এটি অটো সমাপ্তির জন্য ব্যবহার করছি যার জন্য সর্বদা প্রথম আইটেমটি বেছে নেওয়া প্রয়োজন।

Comments

এটি কাজ করে তবে এর ng-optionsচেয়ে দ্রুত এবং বেশি অনুকূলিত হিসাবে ব্যবহার করা উচিত নয় ng-repeat।

— আইসো

@ যদি আপনি আপনার সাথে একমত নন তবে আপনার কি সেই তথ্যের কোনও উত্স আছে?

— অ্যাডাম প্লোচার

ডক্সে ঠিক এখানে: docs.angularjs.org/api/ng/directive/ngOptions " বোঝার অভিব্যক্তির অংশের <select>মাধ্যমে মডেলের মডেলটি কীভাবে নির্ধারণ করা হয়েছে তাতে আরও নমনীয়তা select as", "এর জন্য একটি নতুন সুযোগ তৈরি না করে মেমরির খরচ কমিয়ে আনা প্রতিটি পুনরাবৃত্তি উদাহরণ "," documentFragmentস্বতন্ত্রভাবে পরিবর্তে পরিবর্তে বিকল্পগুলি তৈরি করে গতি রেন্ডার বাড়িয়েছে "

— আইসো

Answer 7

আমার সমাধানটি আমার ডিফল্ট বিকল্পটিকে হার্ডকোড করতে এইচটিএমএল ব্যবহার করা হয়েছিল। তাই ভালো:

এইচএএমএলে:

%select{'ng-model' => 'province', 'ng-options' => "province as province for province in summary.provinces", 'chosen' => "chosen-select", 'data-placeholder' => "BC & ON"}
  %option{:value => "", :selected => "selected"}
    BC & ON

এইচটিএমএলে:

<select ng-model="province" ng-options="province as province for province in summary.provinces" chosen="chosen-select" data-placeholder="BC & ON">
  <option value="" selected="selected">BC &amp; ON</option>
</select>

আমি আমার এপিআই থেকে সমস্ত মান ফিরিয়ে আনতে আমার ডিফল্ট বিকল্পটি চাই, এজন্য আমার একটি ফাঁকা মান আছে। আমার এইচএমএলকেও ক্ষমা করুন। আমি জানি এটি ওপি-র প্রশ্নের সরাসরি উত্তর নয়, তবে লোকেরা এটি গুগলে খুঁজে পান। আশাকরি ইহা অন্য কারো সাহায্য করবে।

Comments

আমি এটি এইচটিএমএলে রূপান্তরিত করার চেষ্টা করেছি কিন্তু এটি চেষ্টা করেছি এমন সমস্ত অনলাইন রূপান্তরকারীদের মধ্যে এটি ব্যর্থ হয়েছে।

— আইকননর

কেন এইচটিএমএল পোস্ট করবেন না? মানে, কোডটি পোস্ট করা কি সত্যিই প্রয়োজনীয় ছিল? ওপ প্রশ্নটির মতো একটি টেম্পলেটিং ইঞ্জিন ব্যবহার করছিল এমন নয়।

— arg20

Answer 8

আপনার মডেল থেকে নির্বাচিত বিকল্প পপুলেট করতে কোডের নীচে ব্যবহার করুন।

<select id="roomForListing" ng-model="selectedRoom.roomName" >

<option ng-repeat="room in roomList" title="{{room.roomName}}" ng-selected="{{room.roomName == selectedRoom.roomName}}" value="{{room.roomName}}">{{room.roomName}}</option>

</select>

Comments

আমার জন্য কাজ করেছেন আমার নির্বাচিত তালিকার জন্য বাইন্ডিং বিকল্পগুলির জন্য দায়ী অ্যাসিঙ্ক্রোনাস কলটি এনজি-মডেল আনার চেয়ে কিছুটা ধীর ছিল তাই এই যোগাযোগটি আমাকে অনেক সহায়তা করেছিল। ধন্যবাদ Eebbesen :-)

— ajaysinghdav10d

এটি আমার পক্ষেও কাজ করে। সহজ এবং বোধগম্য।

— কেন্ট আগুইলার

Answer 9

আপনার কাছে কতগুলি বিকল্প রয়েছে তার উপর নির্ভর করে আপনি আপনার মানগুলিকে একটি অ্যারেতে রাখতে পারেন এবং আপনার বিকল্পগুলি এই জাতীয়করণে স্বয়ংক্রিয়ভাবে পপুলেশন করতে পারেন

<select ng-model="somethingHere.values" ng-options="values for values in [5,4,3,2,1]">
   <option value="">Pick a Number</option>
</select>

Answer 10

আমার ক্ষেত্রে, আমাকে প্রাথমিক বিকল্পটি সন্নিবেশ করা দরকার কেবলমাত্র একটি বিকল্প নির্বাচন করতে ব্যবহারকারীকে বলার জন্য, সুতরাং আমি নীচের কোডটি পছন্দ করি:

<select ...
    <option value="" ng-selected="selected">Select one option</option>
</select>

যখন আমি একটি ফাঁকা স্ট্রিং (নাল) এর মান দিয়ে = অপশনটি চেষ্টা করেছি তখন বিকল্পটি কৌণিক দ্বারা প্রতিস্থাপিত হয়েছিল, তবে, যখন এই বিকল্পটি (নাল মান সহ) রাখে, তখন এই বিকল্পটি দিয়ে নির্বাচন করুন ear

আমার খারাপ ইংরেজির জন্য দুঃখিত এবং আমি আশা করি যে আমি এটির সাথে কোনও কিছুতে সহায়তা করব।

Answer 11

ডিফল্ট মান selectসহ ব্যবহার ngOptionsএবং সেট করা:

আরও ব্যবহারের উদাহরণের জন্য এনজিওশনস ডকুমেন্টেশন দেখুন ngOptions।

angular.module('defaultValueSelect', [])
 .controller('ExampleController', ['$scope', function($scope) {
   $scope.data = {
    availableOptions: [
      {id: '1', name: 'Option A'},
      {id: '2', name: 'Option B'},
      {id: '3', name: 'Option C'}
    ],
    selectedOption: {id: '2', name: 'Option B'} //This sets the default value of the select in the ui
    };
}]);

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0-rc.0/angular.min.js"></script>
<body ng-app="defaultValueSelect">
  <div ng-controller="ExampleController">
  <form name="myForm">
    <label for="mySelect">Make a choice:</label>
    <select name="mySelect" id="mySelect"
      ng-options="option.name for option in data.availableOptions track by option.id"
      ng-model="data.selectedOption"></select>
  </form>
  <hr>
  <tt>option = {{data.selectedOption}}</tt><br/>
</div>

plnkr.co

SELECTকৌণিক ডেটা-বাইন্ডিং সহএইচটিএমএলউপাদানসম্পর্কে অফিসিয়াল ডকুমেন্টেশন ।

বাঁধাই selectএর মাধ্যমে একটি অ স্ট্রিং মান ngModelপার্স / বিন্যাস:

(function(angular) {
  'use strict';
angular.module('nonStringSelect', [])
  .run(function($rootScope) {
    $rootScope.model = { id: 2 };
  })
  .directive('convertToNumber', function() {
    return {
      require: 'ngModel',
      link: function(scope, element, attrs, ngModel) {
        ngModel.$parsers.push(function(val) {
          return parseInt(val, 10);
        });
        ngModel.$formatters.push(function(val) {
          return '' + val;
        });
      }
    };
  });
})(window.angular);

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0-rc.1/angular.min.js"></script>
<body ng-app="nonStringSelect">
  <select ng-model="model.id" convert-to-number>
  <option value="1">One</option>
  <option value="2">Two</option>
  <option value="3">Three</option>
</select>
{{ model }}
</body>

plnkr.co

অন্যান্য উদাহরণ:

angular.module('defaultValueSelect', [])
 .controller('ExampleController', ['$scope', function($scope) {
   $scope.availableOptions = [
     { name: 'Apple', value: 'apple' }, 
     { name: 'Banana', value: 'banana' }, 
     { name: 'Kiwi', value: 'kiwi' }
   ];
   $scope.data = {selectedOption : $scope.availableOptions[1].value};
}]);

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0-rc.0/angular.min.js"></script>
<body ng-app="defaultValueSelect">
  <div ng-controller="ExampleController">
  <form name="myForm">
    <select ng-model="data.selectedOption" required ng-options="option.value as option.name for option in availableOptions"></select>
  </form>  
  </div>
</body>

jsfiddle

Answer 12

এটি আমার পক্ষে কাজ করেছে।

<select ng-model="somethingHere" ng-init="somethingHere='Cool'">
    <option value="Cool">Something Cool</option>
    <option value="Else">Something Else</option>
</select>

Answer 13

আমার ক্ষেত্রে যেহেতু ফর্মের ক্ষেত্রে ক্ষেত্রে ডিফল্ট ক্ষেত্রে আলাদা হয়। আমি সিলেক্ট ট্যাগটিতে একটি কাস্টম বৈশিষ্ট্য যুক্ত করব।

 <select setSeletected="{{data.value}}">
      <option value="value1"> value1....
      <option value="value2"> value2....
       ......

নির্দেশে আমি একটি স্ক্রিপ্ট তৈরি করেছি যা মানটি পরীক্ষা করে এবং কৌণিক যখন এটি পূরণ করে তখন সেই মানটি বিকল্পকে নির্বাচিত করে দেয়।

 .directive('setSelected', function(){
    restrict: 'A',
    link: (scope, element, attrs){
     function setSel=(){
     //test if the value is defined if not try again if so run the command
       if (typeof attrs.setSelected=='undefined'){             
         window.setTimeout( function(){setSel()},300) 
       }else{
         element.find('[value="'+attrs.setSelected+'"]').prop('selected',true);          
       }
     }
    }

  setSel()

})

কেবল ফ্লাইয়ের কফস্ক্রিপ্ট থেকে এটি অনুবাদ করেছেন কমপক্ষে গিস্টটি সঠিক নয় তবে এটির গিস্টটি সঠিক।

এটি সহজতম উপায় নয় তবে মানটি পরিবর্তিত হয়ে গেলে এটি সম্পন্ন করুন

Answer 14

বেন লেশের উত্তরের প্রতিক্রিয়ায় , এই লাইনটি থাকা উচিত

ng-init="somethingHere = somethingHere || options[0]" 

পরিবর্তে

ng-init="somethingHere = somethingHere || options[0].value" 

এটাই,

<select ng-model="somethingHere"
        ng-init="somethingHere = somethingHere || options[0]"
        ng-options="option.name for option in options track by option.value">
</select>

Answer 15

সহজভাবে ng-selected="true"নিম্নলিখিত হিসাবে ব্যবহার করুন :

<select ng-model="myModel">
        <option value="a" ng-selected="true">A</option>
        <option value="b">B</option>
</select>

Answer 16

আমি নিয়ামকটিতে মডেল স্থাপন করব। তারপরে সিলেক্ট সেই মানটিতে ডিফল্ট হবে। প্রাক্তন: এইচটিএমএল:

<select ng-options="..." ng-model="selectedItem">

কৌণিক নিয়ামক (সংস্থান ব্যবহার করে):

myResource.items(function(items){
  $scope.items=items;
  if(items.length>0){
     $scope.selectedItem= items[0];
//if you want the first. Could be from config whatever
  }
});

Answer 17

এটা আমার জন্য কাজ করছে

ng-selected="true" 

Comments

সর্বোত্তম ng-initউপায়টি হ'ল ব্যবহার করা কারণ আপনি একটি এনজি মডেল সেট করছেন।

— জুয়ানজো সালভাদোর

Answer 18

আপনি যদি ng-optionsরেন্ডার করতে ব্যবহার করেন তবে optionএনজি-মডালের সমান মান থাকার চেয়ে ড্রপ ডাউনকে ডিফল্ট নির্বাচন করা হয়েছে। উদাহরণ বিবেচনা করুন:

<select ng-options="list.key as list.name for list in lists track by list.id" ng-model="selectedItem">

সুতরাং বিকল্পটির একই মান রয়েছে list.keyএবং selectedItemএটি ডিফল্ট নির্বাচিত।

Answer 19

অনির্বাচনেযোগ্য হওয়ার জন্য আমার ডিফল্ট "প্লিজ নির্বাচন করুন" দরকার। আমার শর্তসাপেক্ষে একটি ডিফল্ট নির্বাচিত বিকল্প সেট করতে সক্ষম হওয়া দরকার।

আমি এটি নিম্নলিখিত সরল পদ্ধতিতে অর্জন করেছি: জেএস কোড: // নির্বাচিত ডিফল্ট বা ডিফল্ট কোনও ডিফল্ট পরীক্ষা না করতে এই 2 টি ফ্লিপ করুন "দয়া করে নির্বাচন করুন" পাঠ্য //$scope.defaultOption = 0; $ স্কোপ.ডেফাল্ট অপশন = {কী: '3', মান: 'বিকল্প 3'};

$scope.options = [
   { key: '1', value: 'Option 1' },
   { key: '2', value: 'Option 2' },
   { key: '3', value: 'Option 3' },
   { key: '4', value: 'Option 4' }
];

getOptions();

function getOptions(){
    if ($scope.defaultOption != 0)
    { $scope.options.selectedOption = $scope.defaultOption; }
}

এইচটিএমএল:

<select name="OptionSelect" id="OptionSelect" ng-model="options.selectedOption" ng-options="item.value for item in options track by item.key">
<option value="" disabled selected style="display: none;"> -- Please Select -- </option>
</select>
<h1>You selected: {{options.selectedOption.key}}</h1>         

আমি আশা করি এটি একইরকম প্রয়োজনীয়তা আছে এমন অন্য কাউকে সহায়তা করে।

"দয়া করে নির্বাচন করুন" এখানে জোফ্রে আউটটারের উত্তরের মাধ্যমে সম্পন্ন হয়েছিল ।

Answer 20

যদি আপনার কাছে কেবল তারিখের অংশটি শুরু করার পরিবর্তে কিছু জিনিস থাকে তবে আপনি ng-init()এটিকে আপনার নিয়ামক হিসাবে ঘোষণা করে ব্যবহার করতে পারেন এবং এটি আপনার HTML এর শীর্ষে ব্যবহার করতে পারেন। এই ফাংশনটি আপনার নিয়ামকের জন্য কনস্ট্রাক্টরের মতো কাজ করবে এবং আপনি সেখানে আপনার ভেরিয়েবলগুলি শুরু করতে পারেন।

angular.module('myApp', [])
 .controller('myController', ['$scope', ($scope) => {
   $scope.allOptions = [
     { name: 'Apple', value: 'apple' }, 
     { name: 'Banana', value: 'banana' }
   ];
   $scope.myInit = () => {
      $scope.userSelected = 'apple'
      // Other initiations can goes here..
   }
}]);


<body ng-app="myApp">
  <div ng-controller="myController" ng-init="init()">
    <select ng-model="userSelected" ng-options="option.value as option.name for option in allOptions"></select>
   </div>
</body>

Answer 21

    <!--
    Using following solution you can set initial 
default value at controller as well as after change option selected value shown as default.
    -->
    <script type="text/javascript">
      function myCtrl($scope)
        {
          //...
            $scope.myModel=Initial Default Value; //set default value as required
          //..
        }
    </script>
    <select ng-model="myModel" 
                ng-init="myModel= myModel"
                ng-options="option.value as option.name for option in options">
        </select>

Answer 22

আপনার কৌনিক নিয়ামক মধ্যে এটি চেষ্টা করুন ...

$ কিছুহির = {নাম: 'কিছু সামান্য'};

আপনি একটি মান সেট করতে পারেন তবে আপনি একটি জটিল ধরণের ব্যবহার করছেন এবং কৌণিক আপনার দৃষ্টিতে সেট করতে কী / মানটি সন্ধান করবে।

এবং, যদি এটি কাজ না করে, তবে এটি ব্যবহার করে দেখুন: এনজি-অপশন = "অপশনটি। বিকল্প হিসাবে মূল্য। বিকল্প হিসাবে বিকল্পের জন্য বিকল্পের নাম.নাম"

Answer 23

আমি মনে করি সবচেয়ে সহজ উপায়

 ng-selected="$first"

Comments

এই উত্তরটি শূন্য প্রসঙ্গ সরবরাহ করে।

— pspahn