angularjs ng-show vs new templates

Question

私はBean（Coupon、Customer、Company）、 DBに接続するDAO層、Facade Layer（CustomerFacade、CompanyFacade、Admin Facade）を含むJavaでクーポンプロジェクトを持っています。 私はファサードに接続するためのレストサービスを構築しました。私の質問はAdmin.htmlページとAdminコントローラに関するものですが、クーポンタブがプッシュしたときにAdmin.htmlには3つのタブ（クーポン、顧客、会社）クーポンでdivを公開している間に、会社と顧客との2つの他の部門を隠しているので、すべてのクーポンにドロップダウンテーブルが表示され、クーポンを削除または更新することができます。アップデートが完了し、メッセージを表示したいときは、コントローラのすべてのメソッドが7〜8 ngで終了するように、その他の情報をすべて非表示にする必要があります。多くの混乱。 私のコントローラ：

.controller（ '管理者'、[ '$スコープ'、 '$ HTTP'、関数（$スコープ、$ HTTP）{

$scope.tab = 1; 

$http.get("http://localhost:8080/CouponWebService1/rest/admin/getAllCoupons") 
    .then(function(response){ 
    $scope.coupons = response.data; 
}); 
$scope.couponTable= true;  (hiding html element apart from 1) 
$scope.companyTable= false; 
$scope.customerTable= false; 
$scope.successLog = false; 
$scope.couponJointTable = false; 

$http.get("http://localhost:8080/CouponWebService1/rest/admin/getAllCompanies") 
.then(function(response){ 
    $scope.companies = response.data; 
}); 


$http.get("http://localhost:8080/CouponWebService1/rest/admin/getAllCustomers") 
.then(function(response){ 
    $scope.customers = response.data; 
}); 

$scope.select = function(setTab) { 
    $scope.tab = setTab; 
    if (setTab === 2){ 
     $scope.couponTable= false; (hiding html element apart from 1) 
     $scope.companyTable= true; 
     $scope.customerTable= false; 
     $scope.successLog = false; 
     $scope.couponJointTable = false; 
    } 
    else if (setTab === 3){ 
     $scope.couponTable= false; (hiding html element apart from 1) 
     $scope.companyTable= false; 
     $scope.customerTable= true; 
     $scope.successLog = false; 
     $scope.couponJointTable = false; 
    } 
    else{ 
     $scope.couponTable= true; 
     $scope.companyTable= false; 
     $scope.customerTable= false; 
     $scope.successLog = false; 
     $scope.couponJointTable = false; 
    } 
}; 
$scope.isSelected = function (checkTab) { 
    return ($scope.tab === checkTab); 
} 

は、あなたは私がどのように動作するかを私にアドバイスすることができます私は多分テンプレートまたは私が気付いてはいけない何かを、より便利なものに、この加工方法を変更することができますか？ おかげで、

Answer 1

は、単にヘルパー関数に繰り返しものを置く。

function hide_all_and_show_one(elem_to_show){ 
    var all = ['couponTable', 'companyTable', 'customerTable', 
      'successLog', 'couponJointTable']; 
    all.forEach(function(val){ $scope[val] = false; }); 
    $scope[elem_to_show] = true; 
} 

$scope.tab = 1; 

$http.get("http://localhost:8080/CouponWebService1/rest/admin/getAllCoupons") 
    .then(function(response){ $scope.coupons = response.data; }); 
$http.get("http://localhost:8080/CouponWebService1/rest/admin/getAllCompanies") 
    .then(function(response){ $scope.companies = response.data; }); 
$http.get("http://localhost:8080/CouponWebService1/rest/admin/getAllCustomers") 
    .then(function(response){ $scope.customers = response.data; }); 

hide_all_and_show_one('couponTable'); 

$scope.select = function(setTab) { 
    $scope.tab = setTab; 
    if (setTab === 2){ 
    hide_all_and_show_one('companyTable'); 
    } 
    else if (setTab === 3){ 
    hide_all_and_show_one('customerTable'); 
    } 
    else{ 
    hide_all_and_show_one('couponTable'); 
    } 
}; 

$scope.isSelected = function (checkTab) { 
    return ($scope.tab === checkTab); 
}