테스트 사이트 - 개발 중인 베타 버전입니다

angularjs 에서 폼전송 채택완료

Terrorboy 10년 전 조회 6,333

흠.... 브라우져 호환성 때문에 사용을 하지 않으려고 했는데...

하이브리드 앱 작업이 들어가면서 어쩔수 없이 다시 잡게 되었습니다.

 

angularjs에서 form전송이 일반 적이지 않고 따로 무슨처리를 해야 하는것 같네요. 

ajax처리 없이 일반 적인 방법인 form->post->처리페이지->처리 이런식으로 처리 하기 위한 옵션이 따로 존재 하는지요?

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

T
10년 전

</p><p><!DOCTYPE html></p><p><html></p><p><head></p><p><meta charset="UTF-8"></p><p><title>앵귤러</title></p><p><script src="./js/jquery-1.8.3.min.js"></script></p><p><script src="./js/angular.min.js"></script></p><p><span style="font-size: 10pt; line-height: 1.5;"><script type="text/javascript"></span></p><p>function testApp($scope) {</p><p> </p><p><span class="Apple-tab-span" style="white-space: pre;">	</span>$scope.Title = 'Angular 폼전송에 대한 테스트';</p><p>}</p><p> </p><p>function FormApp($scope) {</p><p> </p><p><span class="Apple-tab-span" style="white-space: pre;">	</span>$scope.name = 'Jone';</p><p><span class="Apple-tab-span" style="white-space: pre;">	</span>$scope.ck_name = function() {</p><p> </p><p><span class="Apple-tab-span" style="white-space: pre;">		</span>return '>'+$scope.name+'<';</p><p><span class="Apple-tab-span" style="white-space: pre;">	</span>}</p><p>}</p><p> </p><p>function ArrayTest($scope) {</p><p> </p><p><span class="Apple-tab-span" style="white-space: pre;">	</span>$scope.data = new Array();</p><p><span class="Apple-tab-span" style="white-space: pre;">	</span>$scope.data['test'] = 'test';</p><p><span class="Apple-tab-span" style="white-space: pre;">	</span>$scope.data['text'] = 'text';</p><p><span class="Apple-tab-span" style="white-space: pre;">	</span>// jsone data</p><p><span class="Apple-tab-span" style="white-space: pre;">	</span>$scope.XData = [</p><p><span class="Apple-tab-span" style="white-space: pre;">		</span>{'wow':'1wow', 'foo':'1foo'},</p><p><span class="Apple-tab-span" style="white-space: pre;">		</span>{'wow':'2wow', 'foo':'2foo'},</p><p><span class="Apple-tab-span" style="white-space: pre;">		</span>{'wow':'3wow', 'foo':'3foo'},</p><p><span class="Apple-tab-span" style="white-space: pre;">		</span>{'wow':'4wow', 'foo':'4foo'},</p><p><span class="Apple-tab-span" style="white-space: pre;">		</span>{'wow':'5wow', 'foo':'5foo'},</p><p><span class="Apple-tab-span" style="white-space: pre;">		</span>{'wow':'6wow', 'foo':'6foo'}]</p><p>}</p><p><span style="font-size: 10pt; line-height: 1.5;"></script></span> </p><p></head></p><p><body ng-app="" ng-controller="testApp"></p><p> </p><p> </p><p><!-- 객체에 bind { --></p><p><h1 data-ng-bind="Title">__TITLE__</h1></p><p><!-- } 객체에 bind --></p><p> </p><p><hr></p><p><!-- form test { --></p><p><form action="./upload.php" method="post" ng-controller="FormApp"></p><p><span class="Apple-tab-span" style="white-space:pre">	</span><input type="text" name="name" ng-model="name"></p><p><span class="Apple-tab-span" style="white-space:pre">	</span>이름이 <span>{{ck_name()}}</span>이 맞나요?</p><p><span class="Apple-tab-span" style="white-space:pre">	</span><input type="submit" value="submit"></p><p></form></p><p><!-- } form test --></p><p> </p><p><hr></p><p><!-- 더하기 { --></p><p><div>난 혼자 놀꺼야.. {{5+5}}</div></p><p><!-- } 더하기 --></p><p> </p><p><hr></p><p><!-- 문자열 더하기 { --></p><p><div>난 혼자 놀꺼야.. {{5+""+5}}</div></p><p><!-- } 문자열 더하기 --></p><p> </p><p><hr></p><p><!-- array test { --></p><p><div ng-controller="ArrayTest"></p><p><span class="Apple-tab-span" style="white-space:pre">	</span><div>{{data}}</div></p><p><span class="Apple-tab-span" style="white-space:pre">	</span><div>{{data.test}}</div></p><p><span class="Apple-tab-span" style="white-space:pre">	</span><div>{{data.text}}</div></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre">	</span><ul></p><p><span class="Apple-tab-span" style="white-space:pre">		</span><li ng-repeat="x in XData"></p><p><span class="Apple-tab-span" style="white-space:pre">		</span>wow: {{x.wow}} || foo: {{x.foo}}</p><p><span class="Apple-tab-span" style="white-space:pre">		</span></li></p><p><span class="Apple-tab-span" style="white-space:pre">	</span></ul></p><p></div></p><p><!-- } array test --></p><p> </p><p> </p><p><!-- import test { --></p><p><div ng-include="'import.html'">__IMPORT__</div></p><p><!-- } import test --></p><p> </p><p></body></p><p></html> </p><p>

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

T
Terrorboy
10년 전
하이브리드용으로 사용시 최고일것으로보이네요.
http://mobileangularui.com/
이거랑 원본하고 고민중이네요 ㅎㅎ

댓글을 작성하려면 로그인이 필요합니다.

T
10년 전

어라라.....

되네요.....

 

 

아.. kcp박아놓고 작업 하다 그쪽에서 정지 됬었나보네요 ㅎㅎ

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인