ng-repeat is not working in my sp widget

[jordimsant]

I am trying to do a widget with a select field containing projects in my instance. The code I have developed is the following:

HTML:

<div class="container">
    <div class="section">
        <h2 class="section-header">Facturació</h2>
        <div class="form-group">
            <label for="whatToSee" class="control-label">Què vols veure? </label>
              <select id="opcions" name="opcions" ng-model="data.whatToSee">
                <option ng-repeat="element in data.elements" value="{{::element.value}}">
                  {{element.label}}
                </option>
              </select>
        </div>
    </div>
</div>

Server Script:

(function() {
	/* populate the 'data' object */
	/* e.g., data.table = $sp.getValue('table'); */
	data.instance = gs.getProperty('instance_name');
	
	//Carreguem els projectes com a opcions del formulari
	data.elements = [];
	//gs.log('options.options_table = ' + options.options_table, 'WIDGET');
	var table = new GlideRecord('sys_db_object');
	table.get(options.options_table);

	var gr = new GlideRecord(table.name.toString());
	var query = 'active=true';
	gr.addEncodedQuery(query);
	gr.query();

	while(gr.next()) {
		data.elements.push({
			"value": gr.sys_id.toString(),
			"label": gr.short_description.toString()
		});
	}


})();

I have already checked that data.elements gets correctly populated, but when I try to call element.value and element.label it seems not to be working on the HTML. Anyone knows which is the problem?

[Ankur Bawiskar]

@jordimsant 

try this

HTML:

<div class="container">
    <div class="section">
        <h2 class="section-header">Facturació</h2>
        <div class="form-group">
            <label for="whatToSee" class="control-label">Què vols veure? </label>
              <select id="opcions" name="opcions" ng-model="data.whatToSee">
                <option ng-repeat="element in data.elements" value="{{element.value}}">
                  {{element.label}}
                </option>
              </select>
        </div>
    </div>
</div>

If my response helped please mark it correct and close the thread so that it benefits future readers.

[jordimsant]

I have tried to delete "::" but it is still not working. 

[Ankur Bawiskar · Accepted solution]

@jordimsant 

it worked for me

I will suggest add gs.info() to check what came in data elements

(function() {
	/* populate the 'data' object */
	/* e.g., data.table = $sp.getValue('table'); */
	data.instance = gs.getProperty('instance_name');
	
	//Carreguem els projectes com a opcions del formulari
	data.elements = [];
	//gs.log('options.options_table = ' + options.options_table, 'WIDGET');
	var table = new GlideRecord('sys_db_object');
	table.get(options.options_table);

	gs.info('Options Table is' + options.options_table);
	var gr = new GlideRecord(table.name.toString());
	var query = 'active=true';
	gr.addEncodedQuery(query);
	gr.query();
  gs.info('Row count' + gr.getRowCount());
	while(gr.next()) {
		data.elements.push({
			"value": gr.sys_id.toString(),
			"label": gr.short_description.toString()
		});
	}
	
	gs.info('data elements' + JSON.stringify(data.elements));


})();

If my response helped please mark it correct and close the thread so that it benefits future readers.

[jordimsant]

I have tried exactly what you have creating a new widget and it does not work for me. What can be causing this?