CODEWITHSUNDEEP
angularjsng-tags-input
sajalsuraj
sajalsuraj

Reputation: 992

"Error: type property can't be changed". Getting error while using ngTagInput library (AngularJs)

I am getting an strange error while using ngTagInput library:

Error: type property can't be changed.

Here is the screenshot of that error - Error Screenshot.

HTML Code -

<html ng-app="project">
 <head>
  <link href="/css/ng-tags-input.bootstrap.min.css" rel="stylesheet"/>
  <link href="/css/ng-tags-input.min.css" rel="stylesheet" />
  <script type="text/javascript"  src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js'></script> 
  <script type="text/javascript" src="/assets/bootstrap-3.2.0-dist/js/bootstrap.min.js"></script>
  <script type="text/javascript" src='/js/angular.min.js'></script>  
  <script src="/js/ng-tags-input.min.js"></script>
  <script src="/js/app.js"></script>
 </head>
<body>
<form ng-controller="MainCtrl" role="form">
 <div class="col-md-12 topM10px">
    <tags-input ng-model="formInfo.tags" placeholder="Add a keyword"></tags-input>        
 </div> 

 <div class="col-md-12 topM10px">
    <div ng-click="submitidea()" class="col-md-3 submitbtn">Submit</div>      
 </div> 

</form>
</body>
</html>

Controller code (app.js)-

var app = angular.module('project', ['ngTagsInput']);

app.controller('MainCtrl', function($scope, $http) {
   $scope.formInfo = {};
   $scope.tags = [
     { text: 'Tag1' },
     { text: 'Tag2' },
     { text: 'Tag3' }
   ];
$scope.submitidea = function(){
    console.log($scope.formInfo);     
 }
});

Please someone help. Thanks in advance

Upvotes: 5

Views: 2954

Answers (2)

Diana
Diana

Reputation: 1

Add library angular first

For example:

Upvotes: 0

Daniel Nalbach
Daniel Nalbach

Reputation: 1233

You appear to have a conflict between one of more of your libraries. This can probably be resolved by isolating which library is causing the issue (when commented out, the error goes away), and then trying different versions of that library and/or Angular.

I did a fiddle that uses the same version of Bootstrap and jQuery that you are, but is using Angular 1.4.8 instead of 1.5, so I believe the conflict is between jQuery 1.8.1 and Angular v1.5.0-rc.0 since the fiddle works without any errors. Recommend dropping your Angular version down to 1.4.8 and see if that resolves the issue.

Upvotes: 4

Related Questions