ascarbek / suggestbox Goto Github PK

angular.js:13920 TypeError: Cannot create property '$isNew' on string '1'
at suggest.box.js:584
at angular.js:17385
at m.$digest (angular.js:17524)
at m.$apply (angular.js:17790)
at l (angular.js:11831)
at J (angular.js:12033)
at XMLHttpRequest.t.onload (angular.js:11966)

<my-component list-items="listInterst" smodel="interest" id="interst"></my-component>

app.directive('myComponent', [function() {
    return {
        restrict: 'E',
        scope: {
            listItems:'=listItems',
            selectedItems: '=',
            onChange: '&',
            smodel:'=smodel'
        },
        templateUrl:'/app/templete/interst.html',
        link: function(scope){
            console.log(scope.listItems);
            console.log(scope.smodel);
        }


    }
}]);

<div az-suggest-box sb-list="listItems" sb-model="smodel" class="suggest-box">
    <div class="select">
        <div class="input">
            <div sb-selection-item class="selection-item">
                {{s.label}}&nbsp;<span sb-remove-item-from-selection class="rem-btn"><i class="fa fa-times"></i></span>
                </div>
            <input sb-trigger-area sb-type-ahead tabindex="1">
            </div>
        <button sb-trigger-area><i class="fa fa-chevron-down"></i></button>
        </div>
    <ul class="dropdown">
        <li sb-dropdown-item class="item">{{i.label}}</li>
        </ul>
    </div>

Was comparing Multiselects and ran across yours. 👍

Could you provide a working example of the following that you mentioned in the readme?
"Maybe a picture and two lines of data with gray labels ahead. The picture can be at left side or right side or both or mixed depending on odd/even row index. "

Also, would be great to see plnkr examples of these as it would really help us with implementation.

Great job on this overall.

EDIT: for specificity, these guys did a great job with their example: http://plnkr.co/edit/juqoNOt1z1Gb349XabQ2?p=preview

I set up a directive following your github advice and loaded all the scripts.

    .module('app', ['azSuggestBox'])
    .directive('suggestboxDirective', [function(){
        return {
            restrict: 'E',
            scope: {
                listItems: '=',
                selectedItems: '=',
                onChange: '&'
            },  
            template: '<input class="tagsinput custom-tag-input" type="text" '+
                'sb-list="listItems" ' +
                'sb-model="selectedItems" ' +
                'sb-on-selection-change="onChange()" ui-jq="tagsinput">'+
                    '<Here goes the layout. />'+
                '</>'
        };
    }]);

I'm using the 'controller as' method of binding the allCampaigns (an array of data) to the scope.

I used the directive in my html and placed the bound data in the listItems attribute.

<suggestbox-directive listItems="articlesEditCtrl.allCampaigns" selectedItems="" onChange=""></suggestbox-directive>

The tag input works but I get nothing back from the listItems. No errors, no data, nothing. I know the data is on the scope.

What am I missing?

Hi,
I am using your usefull component, but faced to issue that the text, which a user types, isn't removed after applying the suggested item from the list(picture below).

I haven't found any solutions from the documentation. Could you, please, help me to handle it?

I have tried something like this:

"dependencies": {
...
"angular-suggestbox": "git+https://github.com/Ascarbek/suggestbox.git",
...
}

and have next errors:

ERROR in .//send/index.js
Module not found: Error: Cannot resolve module 'fs' inproj/node_modules/send
@ .//send/index.js 24:9-22

ERROR in .//destroy/index.js
Module not found: Error: Cannot resolve module 'fs' in proj/node_modules/destroy
@ .//destroy/index.js 14:17-30

ERROR in .//etag/index.js
Module not found: Error: Cannot resolve module 'fs' in proj/node_modules/etag
@ .//etag/index.js 22:12-25

ERROR in .//send//mime/mime.js
Module not found: Error: Cannot resolve module 'fs' in proj/node_modules/send/node_modules/mime
@ .//send//mime/mime.js 2:9-22

is it possible to use ur component with npm's package.json?

Allow sb-list to be an array of strings instead of only an array of objects.

var arr = ['yup', 'yep', 'cool']

Your docs said you could install via npm but I ran into an error. I checked the site and you don't show up.

https://www.npmjs.com/search?q=SuggestBox

What am I missing?

First thanks for the components. It's really cool !

My problem is the following. When I try to use az-suggest-box directive and I doesn't set a param with two-way data-binding attributes, I get the following error :

Error: [$compile:nonassign] Expression 'undefined' used with directive 'azSuggestBox' is non-assignable!

When I set all params with two way data binding, it works. Why don't you make optional binding (except for sb-list) ?

Can you set optional data binding in your directives ? It should look like :

scope : { 
     ... , 
     model: ?'=sbModel',
     ... 
}

I'm using angular 1.3.20.

Thanks in advance,

Jisay

Hey
I have applied this directive in a subview and my data comes in parent controller from the server.
If I load the main page first which executes the parent controller then when I navigate to subview, data is shown perfectly but when refresh the sub view, directive gets loaded before the data has arrived from server thus directive does not work.

Is there any way in which directive is loaded in a lazy way ?

It seems that sb-select-first-list-item is not working. Please check this fiddle.

Question:

Is there any way to set a default item for selection when it loads?

Thanks for sharing this.

-beau