কৌনিক ইউআই-বুটস্ট্র্যাপ টাইপহেড কলব্যাক সিলেক ম্যাচে?

Question

আমি কৌনিক ইউআই-বুটস্ট্র্যাপ টাইপহেড ব্যবহার করছি এবং আমি এটি অনেক পছন্দ বাছাই করার উপায় হিসাবে ব্যবহার করতে চাই, সুতরাং সিলেক ম্যাচ পদ্ধতি চালু হওয়ার সময় আমার নির্বাচিত মানটি পাওয়া দরকার তবে কীভাবে করব তা আমি খুঁজে পাচ্ছি না যে আমার নিয়ামক মধ্যে

<div class='container-fluid' ng-controller="TypeaheadCtrl">
<pre>Model: {{selected| json}}</pre>
<input type="text" ng-model="selected" typeahead="state for state in states | filter:$viewValue">

আমি যদি নির্বাচিত মানটি দেখি, প্রতিবার একটি কী চাপলে আমি পরিবর্তন পেয়েছি ...

scope.$watch('selected', function(newValue, oldValue) {... });

আমি পেয়েছি যে পদ্ধতিটি সিলেক্ট ম্যাচ হ'ল তাকে বলা হয় যখন ব্যবহারকারী টিপুন বা তালিকায় ক্লিক করুন তবে আমি কীভাবে কলব্যাক করব তা জানি না ...

ধন্যবাদ!

Answer 1

এটি করার আরও ভাল উপায় আছে। একটি নতুন কলব্যাক পদ্ধতি যুক্ত করা হয়েছে

নিয়ন্ত্রক ফাইলে নিম্নলিখিতগুলি যুক্ত করুন:

 $scope.onSelect = function ($item, $model, $label) {
    $scope.$item = $item;
    $scope.$model = $model;
    $scope.$label = $label;
};

দৃষ্টিতে নিম্নলিখিতগুলি যুক্ত করুন:

 <input type="text"
        ng-model="selected"
        typeahead="state for state in states | filter:$viewValue"
        typeahead-editable="false"
        typeahead-on-select="onSelect($item, $model, $label)"/>

দেখুন Typeahead বৈশিষ্ট আরও তথ্যের জন্য (onSelect অনুসন্ধান)।

নীচের ইউআরএলগুলি http://www.techguides.in/how-to-create-autocomplete- using-angularjs-ui / সহায়তা করে কিনা তা দেখুন

http://www.techguides.in/how-to-customize-autocomplete-to-display-m একাধিক- কলামগুলি- ব্যবহার-angularjs-ui-2/

Comments

ধন্যবাদ! কবজির মতো কাজ করেছেন। এটি সম্ভবত টাইপহেড

— এরিস্টেভ

Call আইটেম head মডেল $ লেবেল অবজেক্টগুলি আসলে সেই কলব্যাক টাইপহেড-অন-সিলেক্ট = 'অনসিলিট ($ আইটেম, $ মডেল, $ লেবেল)' তে আসলে কি রয়েছে সে সম্পর্কে কি কারও ধারণা আছে?

— AardVark71

@ ম্যাট, কীভাবে আমরা অনসিলিট ইভেন্টের সাথে $ http ব্যবহার করে পোস্টব্যাক করতে পারি?

— প্রতীক গায়কওয়াদ

@ AardVark71 $ আইটেম $ মডেল $ এই তিনটি বৈশিষ্ট্য যথাক্রমে নীচে রয়েছে $ যদি আপনি একাধিক সম্পত্তি সম্বলিত JSON অ্যারেকে বাধ্যতামূলক করেন তবে আপনি সমস্ত বৈশিষ্ট্য সহ $ আইটেমে নির্বাচিত আইটেমটি পাবেন। $ মডেলটি ইনবিল্ট কৌণিক মডেল ব্যবহৃত হয় যা নির্বাচিত আইটেমটি সংরক্ষণ করে val মূল্য এবং after লেবেল আপনাকে নির্বাচনের পরে পাঠ্য বাক্সে প্রদর্শিত মান দেবে। সুতরাং সংক্ষিপ্তভাবে অনেক সময়, $ লেবেলটি $ মডেলের সমান হবে। আশা করি এটি আপনার সন্দেহকে পরিষ্কার করে দেয়।

— প্রতীক গায়কওয়াদ

@ AardVark71 এই এক্সপ্রেশনটি ভাল লেগেছে কিনা তা ব্যাখ্যা করা আরও সহজ state.id as state.name for state in states। যে ক্ষেত্রে $itemহয় state, $ মডেল state.id, এবং $labelহয়state.name

— Aximili

Answer 2

সম্পাদনা করুন: এই পদ্ধতিটি এখন সেরা নয়। এইটির উপরের উত্তরে বর্ণিত মত অন সিলেক্ট কলব্যাক ব্যবহার করা আরও ভাল।

আমি যা চেয়েছিলাম তা কীভাবে করব তা আমি খুঁজে পেয়েছি। আমি দেখতে পেলাম যে একটি টাইপহেড-সম্পাদনাযোগ্য বৈশিষ্ট্য রয়েছে এবং যদি এটি মিথ্যাতে সেট করা থাকে তবে কেবলমাত্র মডেল থেকে কোনও মান নির্বাচন করা হলে নির্বাচিত মান পরিবর্তন হয় selected এবং তাই $ ঘড়িটি কখন নতুন মান নির্বাচন করা হয় তা যাচাই করতে ভাল কাজ করছে।

<input type="text" ng-model="selected" typeahead="state for state in states | filter:$viewValue" typeahead-editable="false">

link: function(scope, elm, attrs){
    scope.$watch('selected', function(newValue, oldValue) {
        if (newValue)
          console.log(oldValue+"->"+newValue);
     });
}

Answer 3

নিম্নলিখিতটি আপনার এইচটিএমএল হওয়া উচিত

 <input id="title" type="text"  ng-model="title"  typeahead="data.enquiry_title for data in titleData | filter:$viewValue | limitTo:8" 
typeahead-on-select='onSelect($item, $model, $label)' />

কেবল কলব্যাক ফাংশন সহ ইনপুট ট্যাগে টাইপহেড-অন-সিলেক্ট করুন।

নিম্নলিখিত নিয়ামকের ভিতরে যেতে হবে

$scope.onSelect = function ($item, $model, $label) {
            console.log($item);
            if($item.tid)
                $scope.activeTitleId = $item.tid
        };

আইটেমের অভ্যন্তরে আপনি প্রস্তাবনা তালিকার মূল অ্যারেটিতে পাস করেছেন এমন পুরো বস্তুটি পাবেন

Answer 4

বৈধতার আগে নিম্নলিখিত চেষ্টা করুন

 modelCtrl.$setValidity('editable', true);