Gọi 1 function trong ng-repeat trong angular như thế nào ?

  • 1,5K lượt xem
  • Bài cuối 26 Tháng Tám 2016
  • Chủ đề được giải quyết
easyphuoc đăng này 24 Tháng Tám 2016

Hi all,

Anh em cho mình hỏi cái này với. Giả sử như thế này, trong database tôi có 2 bảng, 1 bảng user và một bảng profile để lưu thông tin của user liên kết qua ID

1/ nội dung html

 

<div ng-repeat="item in Users"> 

<span>{{getProfile(item.ID).FullName}}</span>

 </div>

 

2/ controller angular

 

$scope.getProfile = function (id){

$http.get('/user/getbyid/' + id).then(function(result){

return result.data;

});

}

 

Khi chạy thì lỗi 

Uncaught Error: 100 $digest() iterations reached. Aborting!

Và treo trình duyệt, do lỗi chạy liên tục.

Khi bỏ {{getProfile(item.ID).FullName}} thì chạy bình thường

Mọi người có cách nào để get info của một id trong vòng lặp này mà không bị lỗi không ah ?

 

Sắp xếp theo: Chuẩn | Mới nhất | Bình chọn
admin đăng này 24 Tháng Tám 2016

Nếu đã liên kết với nhau thông qua khoá ngoại, sao bạn không gọi trực tiếp item.Profile.

Chỉ cần trong API mình select include thêm Profile và ViewModel có chứa thuộc tính Profile là nó map luôn sang. Bạn có thể truy cập vào đối tượng khác thông qua khoá ngoại mà.

TEDU

  • Thích bởi
  • easyphuoc
admin đăng này 24 Tháng Tám 2016

Bạn tham khảo topic này nhé: http://forum.tedu.com.vn/thread/lien-ket-nhieu-bang-trong-api-nhu-the-nao/

TEDU

  • Thích bởi
  • easyphuoc
easyphuoc đăng này 24 Tháng Tám 2016

Oke tuyệt vời thanks Admin ! 

  • Thích bởi
  • admin
easyphuoc đăng này 26 Tháng Tám 2016

Hi admin,

 

Minh có 2 bảng đơn giản thế thế này

 

public class ApplicationUser : IdentityUser
{
   public string FullName {get;set;}
   public string UserName {get;set;}

   public virtual Profile Profile { get; set; }
}

public class Profile
{
   public string UserId {get;set;}

   public string Mobile {get;set;}

   public string Company {get;set;}

   [ForeignKey("UserId")]
   public virtual ApplicationUser ApplicationUser { get; set; }

}




Khi mình chạy code api select 1 user và consol.log ra thì nó lại ra, Profile null

 

Object{
   FullName: "Nguyễn Văn A"
   UserName: nguyenvana
   Profile: null

}

Mình muốn hiện luôn thông tin Profile này ra luôn nhưng sao nó lại không ra nhĩ ? 

Admin xem giúp mình với

 

 

 

phitienlam đăng này 26 Tháng Tám 2016

trong service lúc select thì phải include Profile vào mới thấy đc 

var user=_userSerive.getall(dk,new string[]{"profile"})

  • Thích bởi
  • easyphuoc
admin đăng này 26 Tháng Tám 2016

Bổ sung phitienlam là var user=_userSerive.GetAll(dk,new string[]{"Profile"})

Thuộc tính được include trong hàm phải giống tên thuộc tính của đối tượng. Ở đây là thuộc tính Profile

TEDU

  • Thích bởi
  • easyphuoc
easyphuoc đăng này 26 Tháng Tám 2016

Okie ngon lành rồi, thanks phitienlam & admin nhiều ah.!!

easyphuoc đăng này 26 Tháng Tám 2016

Hi all,

Trường hợp 2 bảng đã tốt rồi, nhưng mình liên kết tiếp bảng thứ ba, nhưng bảng thứ 3 này là liên kết 1 user nhiều thẻ ATM cụ thể 3 bảng như sau

 

public class ApplicationUser : IdentityUser
{
   public string FullName {get;set;}
   public string UserName {get;set;}

   public virtual Profile Profile { get; set; }

   public virtual IEnumerable<Atm> Atms { get; set; }

}

public class Profile
{
   public string UserId {get;set;}

   public string Mobile {get;set;}

   public string Company {get;set;}

   [ForeignKey("UserId")]
   public virtual ApplicationUser ApplicationUser { get; set; }

}

public class Atm
{
   [key]
   public int ID {get;set;}

   [StringLength(128)]
   [Column(TypeName = "nvarchar")]
   public string UserId {get;set}

   public string BankName {get;set}

   public string BankAccountName {get;set;}

   public string BankAccountNumber {get;set;}

   [ForeignKey("UserId")]
    public virtual ApplicationUser ApplicationUser { get; set; }

}

 

Và trong Service mình gọi thế này

var user=_userSerive.GetAll(dk,new string[] {"Profile", "Atms"});

=> Khi chạy đến dòng này thì nó xảy ra lỗi không hợp lệ.

Vậy trường hợp này thì sao ta ? chỉ mình với.

 

phitienlam đăng này 26 Tháng Tám 2016

thay đổi csdl thì bạn đã update database chưa vậy ! nếu update thành công thì post lỗi lên xem

easyphuoc đăng này 26 Tháng Tám 2016

Hi phitienlam,

3 bảng database mình đã tạo trước và update chắc chắn rồi.

Và đây là lỗi khi chạy đến dòng lệnh Service trả về catch (Exception ex) trong function HttpResponseMessage CreateHttpResponse lỗi như sau:

"A specified Include path is not valid. The EntityType 'Project.Data.ApplicationUser' does not declare a navigation property with the name 'Atms'."

Bạn xem giúp mình với, chẳng hiểu vì sao mà không hợp lệ ?, cơ bản là mình thấy đúng về code mà !

 

 

phitienlam đăng này 26 Tháng Tám 2016

 ko tạo thành công đâu ! kiểu dữ liệu UserId trong bảng ATm kìa bạn ! xem lại nhé

easyphuoc đăng này 26 Tháng Tám 2016

Hi phitienlam,

 Mình có gắng trong bảng Atms mà:

 

public class Atm
{
   [key]
   public int ID {get;set;}

   [StringLength(128)]
   [Column(TypeName = "nvarchar")]
   public string UserId {get;set}

   public string BankName {get;set}

   public string BankAccountName {get;set;}

   public string BankAccountNumber {get;set;}

   [ForeignKey("UserId")]
    public virtual ApplicationUser ApplicationUser { get; set; }

}

 

và bên table ApplicationUser đã có

 

public virtual IEnumerable<Atm> Atms { get; set; }

 

Mình thấy đủ rồi mà ? phải ko ?

 

 

 

easyphuoc đăng này 26 Tháng Tám 2016

Ah mình gõ lên đây nhằm chỗ đó, nhưng trong code mình vẫn đúng nha bạn, mình vừa sửa lại trên này cho hợp lý rồi. nó vẫn không chạy nha bạn.  và update thì okie không có lỗi xảy ra.

phitienlam đăng này 26 Tháng Tám 2016

lúc chạy migrations bạn xem có cái dòng đỏ nào ko ! có là ko thành công đâu nhé

easyphuoc đăng này 26 Tháng Tám 2016

 Mình không thấy lỗi xảy ra khi chạy Migration và tạo thành công và kiểm tra bảng liên kết trong SQL Server đều đúng.

phitienlam đăng này 26 Tháng Tám 2016

loại trừ các khả năng theo mình giờ bạn muốn lấy danh sách Atm từ user thì có thể phát triển 1 hàm bên repository !

bạn có thể tham khảo 

  public IEnumerable<ATm> GetATmByUser(string user)
        {
            var query = from p in DbContext.ApplicationUSer
                        join pt in DbContext.ATm
                        on p.username equals pt.userid

                        select pt;


            return query;
        }

mình sợ nó ko render  sang linq đc trong include

easyphuoc đăng này 26 Tháng Tám 2016

Ok bạn, trong trường hợp lấy 1 user thì kiểu của bạn sẽ ok, nhưng khi hiện 1 list danh sách và get thông tin ATM thì sẽ bị lỗi vòng lặp không ngừng trong angular, ví dụ như thế này:

<div ng-repeat="item in users">
  <div>
      {{item.FullName}}
        <ul>
         <li ng-repeat="atm in getUser(item.UserId)">
          {{atm.BankName}}
         </li>
        </ul>
  </div>
</div>

 => lỗi vòng lặp và treo trình duyệt khi chạy đoạn trên

-------------------------

Cách sau đây theo mình là tốt nhất nếu load được atms trong từng user mà không cần getUser

<div ng-repeat="item in users">
  <div>
      {{item.FullName}}
        <ul>
         <li ng-repeat="atm in item.Atms">
          {{atm.BankName}}
         </li>
        </ul>
  </div>
</div>

Có cách nào không nhĩ

 

easyphuoc đăng này 26 Tháng Tám 2016

Phải chi thằng Angular chạy vòng lặp ng-repeat cho sử dụng function bên trong thoải mái thì hay quá, khỏi mất công lấy nhiều bảng như thế này cho đỡ rối. ^^

easyphuoc đăng này 26 Tháng Tám 2016

Hi,

Mình đã xử lý được rồi, đây là do lỗi ở IEnumerable

public virtual IEnumerable<Atm> Atms { get; set; }

Và chuyển thành

public virtual ICollection<Atm> Atms { get; set; }

=> thế là hết lỗi

Thanks bạn !

Close