Почему Angular не работает с циклом?

Question

[Umid]

При написании цикла на js, весь Angular скрипт и атрибуты выключаются, и выводится только сам цикл.
Как можно исправить?

Весь Скрипт:

var myApp = angular.module("myApp" , []);

myApp.controller("firstCtrl", function($scope){
    $scope.name = "World";
});

myApp.controller('PhoneListCtrl', function($scope){
	$scope.phones  = [
		{'name' : 'Nexus',
		 'snippet' : 'Lorem ipsum dolor sit amet, consectetur adipisicing elit.',
		 'status': true},
		{'name' : 'HTC',
	 	 'snippet' : 'Lorem ipsum dolor sit amet, consectetur adipisicing elit.',
	 	 'status' : false},
	 	{'name' : 'Huawei',
	 	 'snippet' : 'Lorem ipsum dolor sit amet, consectetur adipisicing elit.',
	 	 'status' : true}
	];

	var date = new Date();
	$scope.today = date;
       
      //Цикл
	myNumber = 10;
	function newFunc(number){
		newArray = new Array(number);
		for (var i = 0; i < newArray.length; i++) {
			newArray[i] = 'Number: ' + (i + 1) + '<br />';
			document.write(newArray[i]);
		};
	};
	newFunc(myNumber);
});

Comments

[Алексей Уколов]

Нулевой шаг на пути к решению вашего вопроса - показать неработающий код, объяснить как он должен работать и как работает сейчас.

[Алексей Уколов]

Поздравляю, вам удалось выполнить нулевой шаг наполовину!

Answer 1

[Алексей Уколов]

Насколько я понял из вашего описания проблемы, дело в document.write - он просто перезаписывает все, что есть на странице (подробнее).
Вам нужно писать в innerHtml какого-то конкретного элемента - вот так:

var myNumber = 10;

function newFunc(number) {
    var el = document.getElementById('bar'),
        content = '';
    
    for (var i = 1; i <= number; i++) {
        content += 'Number: ' + i + '<br />';
    }
    
    el.innerHTML = content;
}

newFunc(myNumber);

А с массивами лучше работать так (вот почему):

var myNumber = 10;

function newFunc(number) {
    var newArray = [],
          str;

    for (var i = 0; i < number; i++) {
        str = 'Number: ' + (i + 1) + '<br />';
        newArray.push(str);
        console.log(str);
    }
}

newFunc(myNumber);

Это при условии, что вам действительно потом нужен этот массив, и вы не используете его как кривую замену обычному оператору for:

var myNumber = 10;

function newFunc(number) {
    for (var i = 1; i <= number; i++) {
        console.log('Number: ' + i + '<br />');
    }
}

newFunc(myNumber);

Answer 2

[Сергей Протько]

вот смотрю я и удивляюсь, зачем вам аргуляр?

document.write - причина вашей проблемы. Просто откажитесь от этого. Вот эта вся сатана которую вы делаете в контроллере можно сделать в шаблоне (и нужно делать там).

<ul>
    <li ng-repeat="phone in phones">Number: {{$index + 1}}</li>
</ul>

В контроллере только работа с данными (по хорошему с данными работают серсивы, а контроллеры им просто эту обязанность дилегируют, но это судя по всему уже сложно).